tudor.stanciu/reverse-proxy-frontend
tudor.stanciu/reverse-proxy-frontend
1
0
Fork 0
mirror of https://dev.azure.com/tstanciu94/ReverseProxy/_git/ReverseProxy_Frontend synced 2025-08-05 17:22:36 +03:00
Code Issues 3 Packages Projects Releases Wiki Activity

Add SSL policy options and components for advanced forwarding settings

Browse Source
This commit is contained in:
Tudor Stanciu 2025-07-12 15:20:49 +03:00
parent 5b0b6ce813
commit 4b7b22230f
7 changed files with 173 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
public/locales/en/translations.json
View File

@ -98,6 +98,18 @@
"Definition": "Change points are combinations of html tags and attributes that are used by system to identify elements from http content and replace the key in theirs content with respect for exceptions.",
"HtmlTag": "Html tag",
"Attribute": "Attribute"
},
"SslPolicy": {
"Label": "SSL policy",
"Tooltip": "SSLPolicy is used to set the SSL options for the forward. It can be used to bypass self signed or invalid SSL certificates for the upstream server.",
"Bypass": {
"InvalidCertificates": "Bypass invalid certificates",
"InvalidCertificatesDescription": "With this option is enabled, the reverse proxy will not validate the SSL certificate of the upstream server. This is useful for self-signed certificates or when the upstream server has an invalid certificate.",
"CertificateNameMismatch": "Bypass certificate name mismatch",
"CertificateNameMismatchDescription": "With this option is enabled, the reverse proxy will not validate the SSL certificate name against the upstream server's hostname. This is useful when the upstream server's certificate does not match its hostname.",
"CertificateChainErrors": "Bypass certificate chain errors",
"CertificateChainErrorsDescription": "With this option is enabled, the reverse proxy will not validate the SSL certificate chain of the upstream server. This is useful when the upstream server's certificate chain is incomplete or invalid."
}
}
}
},

12
public/locales/ro/translations.json
View File

@ -89,6 +89,18 @@
"Definition": "Punctele de schimbare sunt combinații de etichete și atribute html care sunt utilizate de sistem pentru a identifica elemente din conținutul http și pentru a înlocui cheia în conținutul lor, dar cu respectarea excepțiilor.",
"HtmlTag": "Etichetă html",
"Attribute": "Atribut"
},
"SslPolicy": {
"Label": "Politica SSL",
"Tooltip": "Politica SSL este utilizată pentru a seta opțiunile SSL pentru redirecționare. Poate fi utilizată pentru a ocoli certificatele SSL autosemnate sau nevalide pentru serverul către care redirecționează traficul.",
"Bypass": {
"InvalidCertificates": "Ocolește certificatele nevalide",
"InvalidCertificatesDescription": "Cu această opțiune este activată, proxy-ul nu va valida certificatul SSL al serverului din amonte. Acest lucru este util pentru certificatele autosemnate sau atunci când serverul din amonte are un certificat nevalid.",
"CertificateNameMismatch": "Ocolește nepotrivirea numelui certificatului",
"CertificateNameMismatchDescription": "Cu această opțiune este activată, proxy-ul nu va valida numele certificatului SSL în raport cu numele de gazdă al serverului din amonte. Acest lucru este util atunci când certificatul serverului din amonte nu corespunde cu numele său de gazdă.",
"CertificateChainErrors": "Ocolește erorile lanțului de certificate",
"CertificateChainErrorsDescription": "Cu această opțiune este activată, proxy-ul nu va valida lanțul de certificate SSL al serverului din amonte. Acest lucru este util atunci când lanțul de certificate al serverului din amonte este incomplet sau invalid."
}
}
}
},

7
src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
View File

@ -6,6 +6,7 @@ import PathInjectionCard from "./pathInjection/PathInjectionCard";
import KeyOverwriteCard from "./keyOverwrite/KeyOverwriteCard";
import SpecificHeadersCard from "./specificHeaders/SpecificHeadersCard";
import UpstreamSchemeCard from "./upstreamScheme/UpstreamSchemeCard";
import SslPolicyCard from "./sslPolicy/SslPolicyCard";
const ForwardOptionsAdvancedComponent = ({ options }) => {
return (
@ -46,6 +47,12 @@ const ForwardOptionsAdvancedComponent = ({ options }) => {
<br />
</>
)}
{options.sslPolicy && (
<>
<SslPolicyCard data={options.sslPolicy} />
<br />
</>
)}
</>
);
};

27
src/features/forwards/options/components/advanced/sslPolicy/SslPolicyCard.js Normal file
View File

@ -0,0 +1,27 @@
import React from "react";
import PropTypes from "prop-types";
import ExpandableCard from "../../../../../../components/common/ExpandableCard";
import { useTranslation } from "react-i18next";
import HttpsIcon from "@material-ui/icons/Https";
import SslPolicySummary from "./SslPolicySummary";
import SslPolicyComponent from "./SslPolicyComponent";
const SslPolicyCard = ({ data }) => {
const { t } = useTranslation();
return (
<ExpandableCard
Icon={<HttpsIcon />}
title={t("Forward.Options.SslPolicy.Label")}
subtitle={t("Forward.Options.SslPolicy.Tooltip")}
Summary={<SslPolicySummary data={data} />}
Content={<SslPolicyComponent data={data.bypass} />}
/>
);
};
SslPolicyCard.propTypes = {
data: PropTypes.object.isRequired
};
export default SslPolicyCard;

73
src/features/forwards/options/components/advanced/sslPolicy/SslPolicyComponent.js Normal file
View File

@ -0,0 +1,73 @@
import React from "react";
import PropTypes from "prop-types";
import { Grid, useTheme } from "@material-ui/core";
import { useTranslation } from "react-i18next";
import ActiveIcon from "../../../../../../components/common/ActiveIcon";
const SslPolicyComponent = ({ data }) => {
const { t } = useTranslation();
const theme = useTheme();
const fields = [
{
key: "invalidCertificates",
label: t("Forward.Options.SslPolicy.Bypass.InvalidCertificates"),
description: t(
"Forward.Options.SslPolicy.Bypass.InvalidCertificatesDescription"
)
},
{
key: "certificateNameMismatch",
label: t("Forward.Options.SslPolicy.Bypass.CertificateNameMismatch"),
description: t(
"Forward.Options.SslPolicy.Bypass.CertificateNameMismatchDescription"
)
},
{
key: "certificateChainErrors",
label: t("Forward.Options.SslPolicy.Bypass.CertificateChainErrors"),
description: t(
"Forward.Options.SslPolicy.Bypass.CertificateChainErrorsDescription"
)
}
];
return (
<Grid container spacing={2}>
{fields.map(({ key, label, description }) => (
<Grid item xs={12} key={key}>
<Grid container spacing={1} alignItems="center">
<Grid item xs={3}>
<>
<ActiveIcon active={!!data[key]} />
<span
style={{
fontWeight: theme.typography.fontWeightMedium,
marginLeft: 8
}}
>
{label}:
</span>
</>
</Grid>
<Grid item xs={9}>
<span style={{ color: "#666", fontSize: "0.95em" }}>
{description}
</span>
</Grid>
</Grid>
</Grid>
))}
</Grid>
);
};
SslPolicyComponent.propTypes = {
data: PropTypes.shape({
acinvalidCertificates: PropTypes.bool,
certificateNameMismatch: PropTypes.bool,
certificateChainErrors: PropTypes.bool
}).isRequired
};
export default SslPolicyComponent;

37
src/features/forwards/options/components/advanced/sslPolicy/SslPolicySummary.js Normal file
View File

@ -0,0 +1,37 @@
import React from "react";
import PropTypes from "prop-types";
import { Grid } from "@material-ui/core";
import { useTranslation } from "react-i18next";
import ActiveIcon from "../../../../../../components/common/ActiveIcon";
const SslPolicySummary = ({ data }) => {
const { t } = useTranslation();
return (
<>
<Grid container>
<Grid item xs={6} sm={3} md={3}>
{`${t("General.Enabled")}: `}
<ActiveIcon active={data.on} />
</Grid>
<Grid item xs={6} sm={3} md={3}>
{`${t("Forward.Options.SslPolicy.Bypass.InvalidCertificates")}: `}
<ActiveIcon active={!!data.bypass.invalidCertificates} />
</Grid>
<Grid item xs={6} sm={3} md={3}>
{`${t("Forward.Options.SslPolicy.Bypass.CertificateNameMismatch")}: `}
<ActiveIcon active={!!data.bypass.certificateNameMismatch} />
</Grid>
<Grid item xs={6} sm={3} md={3}>
{`${t("Forward.Options.SslPolicy.Bypass.CertificateChainErrors")}: `}
<ActiveIcon active={!!data.bypass.certificateChainErrors} />
</Grid>
</Grid>
</>
);
};
SslPolicySummary.propTypes = {
data: PropTypes.object.isRequired
};
export default SslPolicySummary;

5
src/features/forwards/options/components/simple/ForwardOptionsComponent.js
View File

@ -58,6 +58,11 @@ const ForwardOptionsComponent = ({ title, options }) => {
label: "Forward.Options.UpstreamScheme.Label",
tooltip: "Forward.Options.UpstreamScheme.Tooltip",
active: options.upstreamScheme
},
{
label: "Forward.Options.SslPolicy.Label",
tooltip: "Forward.Options.SslPolicy.Tooltip",
active: !!options.sslPolicy
}
],
[options]