From caab396b56a011031b8d414dd179ff6345980f73 Mon Sep 17 00:00:00 2001 From: Jens Langhammer Date: Mon, 13 Dec 2021 15:36:05 +0100 Subject: [PATCH] web/admin: improve wording for froward_auth, don't show setup when using proxy mode Signed-off-by: Jens Langhammer --- web/src/locales/en.po | 41 ++++++- web/src/locales/fr_FR.po | 41 ++++++- web/src/locales/pseudo-LOCALE.po | 39 ++++++- .../providers/proxy/ProxyProviderForm.ts | 28 +++-- .../providers/proxy/ProxyProviderViewPage.ts | 109 ++++++++++-------- 5 files changed, 189 insertions(+), 69 deletions(-) diff --git a/web/src/locales/en.po b/web/src/locales/en.po index 215ed92d7..7e849d917 100644 --- a/web/src/locales/en.po +++ b/web/src/locales/en.po @@ -296,6 +296,10 @@ msgstr "Alternatively, if your current device has Duo installed, click on this l msgid "Always require consent" msgstr "Always require consent" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "An example setup can look like this:" +msgstr "An example setup can look like this:" + #: src/pages/stages/prompt/PromptForm.ts msgid "Any HTML can be used." msgstr "Any HTML can be used." @@ -445,6 +449,10 @@ msgstr "Authentication" msgid "Authentication Type" msgstr "Authentication Type" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "Authentication URL" +msgstr "Authentication URL" + #: src/pages/sources/oauth/OAuthSourceForm.ts #: src/pages/sources/plex/PlexSourceForm.ts #: src/pages/sources/saml/SAMLSourceForm.ts @@ -1855,7 +1863,6 @@ msgstr "External Applications which use authentik as Identity-Provider, utilizin msgid "External Host" msgstr "External Host" -#: src/pages/providers/proxy/ProxyProviderForm.ts #: src/pages/providers/proxy/ProxyProviderForm.ts #: src/pages/providers/proxy/ProxyProviderForm.ts msgid "External host" @@ -2344,6 +2351,10 @@ msgstr "Import certificates of external providers or create certificates to sign msgid "In case you can't access any other method." msgstr "In case you can't access any other method." +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "In this case, you'd set the Authentication URL to auth.example.com and Cookie domain to example.com." +msgstr "In this case, you'd set the Authentication URL to auth.example.com and Cookie domain to example.com." + #: src/pages/users/UserListPage.ts msgid "Inactive" msgstr "Inactive" @@ -2996,6 +3007,10 @@ msgstr "No Stages bound" msgid "No additional data available." msgstr "No additional data available." +#: src/pages/providers/proxy/ProxyProviderViewPage.ts +msgid "No additional setup is required." +msgstr "No additional setup is required." + #: src/elements/forms/ModalForm.ts msgid "No form found" msgstr "No form found" @@ -3210,8 +3225,8 @@ msgid "Optionally set the 'FriendlyName' value of the Assertion attribute." msgstr "Optionally set the 'FriendlyName' value of the Assertion attribute." #: src/pages/providers/proxy/ProxyProviderForm.ts -msgid "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." -msgstr "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +#~ msgid "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +#~ msgstr "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." #: src/pages/flows/BoundStagesList.ts #: src/pages/flows/StageBindingForm.ts @@ -4109,6 +4124,10 @@ msgstr "Set a custom HTTP-Basic Authentication header based on values from authe msgid "Set custom attributes using YAML or JSON." msgstr "Set custom attributes using YAML or JSON." +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "Set this to the domain you wish the authentication to be valid for. Must be a parent domain of the URL above. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +msgstr "Set this to the domain you wish the authentication to be valid for. Must be a parent domain of the URL above. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." + #: src/pages/providers/proxy/ProxyProviderViewPage.ts msgid "Setup" msgstr "Setup" @@ -4845,8 +4864,12 @@ msgid "The external URL you'll access the application at. Include any non-standa msgstr "The external URL you'll access the application at. Include any non-standard port." #: src/pages/providers/proxy/ProxyProviderForm.ts -msgid "The external URL you'll authenticate at. Can be the same domain as authentik." -msgstr "The external URL you'll authenticate at. Can be the same domain as authentik." +#~ msgid "The external URL you'll authenticate at. Can be the same domain as authentik." +#~ msgstr "The external URL you'll authenticate at. Can be the same domain as authentik." + +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "The external URL you'll authenticate at. The authentik core server should be reachable under this URL." +msgstr "The external URL you'll authenticate at. The authentik core server should be reachable under this URL." #: #~ msgid "The following objects use {0}:" @@ -5782,6 +5805,10 @@ msgstr "You're about to be redirect to the following URL." msgid "You're currently impersonating {0}. Click to stop." msgstr "You're currently impersonating {0}. Click to stop." +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "app1 running on app1.example.com" +msgstr "app1 running on app1.example.com" + #: #~ msgid "authentik Builtin Database" #~ msgstr "authentik Builtin Database" @@ -5790,6 +5817,10 @@ msgstr "You're currently impersonating {0}. Click to stop." #~ msgid "authentik LDAP Backend" #~ msgstr "authentik LDAP Backend" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "authentik running on auth.example.com" +msgstr "authentik running on auth.example.com" + #: src/elements/forms/DeleteForm.ts msgid "connecting object will be deleted" msgstr "connecting object will be deleted" diff --git a/web/src/locales/fr_FR.po b/web/src/locales/fr_FR.po index cb2d9a9c9..a1795f88b 100644 --- a/web/src/locales/fr_FR.po +++ b/web/src/locales/fr_FR.po @@ -300,6 +300,10 @@ msgstr "Sinon, si Duo est installé sur cet appareil, cliquez sur ce lien :" msgid "Always require consent" msgstr "Toujours exiger l'approbation" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "An example setup can look like this:" +msgstr "" + #: src/pages/stages/prompt/PromptForm.ts msgid "Any HTML can be used." msgstr "" @@ -449,6 +453,10 @@ msgstr "Authentification" msgid "Authentication Type" msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "Authentication URL" +msgstr "" + #: src/pages/sources/oauth/OAuthSourceForm.ts #: src/pages/sources/plex/PlexSourceForm.ts #: src/pages/sources/saml/SAMLSourceForm.ts @@ -1841,7 +1849,6 @@ msgstr "Applications externes qui utilisent authentik comme fournisseur d'identi msgid "External Host" msgstr "Hôte externe" -#: src/pages/providers/proxy/ProxyProviderForm.ts #: src/pages/providers/proxy/ProxyProviderForm.ts #: src/pages/providers/proxy/ProxyProviderForm.ts msgid "External host" @@ -2327,6 +2334,10 @@ msgstr "Importer les certificats des fournisseurs externes ou créer des certifi msgid "In case you can't access any other method." msgstr "Au cas où aucune autre méthode ne soit disponible." +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "In this case, you'd set the Authentication URL to auth.example.com and Cookie domain to example.com." +msgstr "" + #: src/pages/users/UserListPage.ts msgid "Inactive" msgstr "Inactif" @@ -2974,6 +2985,10 @@ msgstr "Aucune étape liée" msgid "No additional data available." msgstr "Aucune donnée additionnelle disponible." +#: src/pages/providers/proxy/ProxyProviderViewPage.ts +msgid "No additional setup is required." +msgstr "" + #: src/elements/forms/ModalForm.ts msgid "No form found" msgstr "Aucun formulaire trouvé" @@ -3185,8 +3200,8 @@ msgid "Optionally set the 'FriendlyName' value of the Assertion attribute." msgstr "Indiquer la valeur \"FriendlyName\" de l'attribut d'assertion (optionnel)" #: src/pages/providers/proxy/ProxyProviderForm.ts -msgid "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." -msgstr "Indiquer votre domaine parent (optionnel), si vous souhaitez que l'authentification et l'autorisation soient réalisés au niveau du domaine. Si vous exécutez des applications sur app1.domain.tld, app2.domain.tld, indiquez ici \"domain.tld\"." +#~ msgid "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +#~ msgstr "Indiquer votre domaine parent (optionnel), si vous souhaitez que l'authentification et l'autorisation soient réalisés au niveau du domaine. Si vous exécutez des applications sur app1.domain.tld, app2.domain.tld, indiquez ici \"domain.tld\"." #: src/pages/flows/BoundStagesList.ts #: src/pages/flows/StageBindingForm.ts @@ -4072,6 +4087,10 @@ msgstr "Définir un en-tête d'authentification HTTP-Basic personnalisé basé s msgid "Set custom attributes using YAML or JSON." msgstr "Définissez des attributs personnalisés via YAML ou JSON." +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "Set this to the domain you wish the authentication to be valid for. Must be a parent domain of the URL above. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +msgstr "" + #: src/pages/providers/proxy/ProxyProviderViewPage.ts msgid "Setup" msgstr "" @@ -4799,8 +4818,12 @@ msgid "The external URL you'll access the application at. Include any non-standa msgstr "L'URL externe par laquelle vous accéderez à l'application. Incluez un port non-standard si besoin." #: src/pages/providers/proxy/ProxyProviderForm.ts -msgid "The external URL you'll authenticate at. Can be the same domain as authentik." -msgstr "L'URL externe sur laquelle vous vous authentifierez. Cela peut être le même domaine qu'authentik." +#~ msgid "The external URL you'll authenticate at. Can be the same domain as authentik." +#~ msgstr "L'URL externe sur laquelle vous vous authentifierez. Cela peut être le même domaine qu'authentik." + +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "The external URL you'll authenticate at. The authentik core server should be reachable under this URL." +msgstr "" #~ msgid "The following objects use {0}:" #~ msgstr "Les objets suivants utilisent {0} :" @@ -5718,12 +5741,20 @@ msgstr "Vous allez être redirigé vers l'URL suivante." msgid "You're currently impersonating {0}. Click to stop." msgstr "Vous êtes en train de vous faire passer pour {0}. Cliquez pour arrêter." +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "app1 running on app1.example.com" +msgstr "" + #~ msgid "authentik Builtin Database" #~ msgstr "Base de données intégrée à authentik" #~ msgid "authentik LDAP Backend" #~ msgstr "Backend LDAP authentik" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "authentik running on auth.example.com" +msgstr "" + #: src/elements/forms/DeleteForm.ts msgid "connecting object will be deleted" msgstr "L'objet connecté sera supprimé" diff --git a/web/src/locales/pseudo-LOCALE.po b/web/src/locales/pseudo-LOCALE.po index 3082044af..9ccb43584 100644 --- a/web/src/locales/pseudo-LOCALE.po +++ b/web/src/locales/pseudo-LOCALE.po @@ -296,6 +296,10 @@ msgstr "" msgid "Always require consent" msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "An example setup can look like this:" +msgstr "" + #: src/pages/stages/prompt/PromptForm.ts msgid "Any HTML can be used." msgstr "" @@ -441,6 +445,10 @@ msgstr "" msgid "Authentication Type" msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "Authentication URL" +msgstr "" + #: src/pages/sources/oauth/OAuthSourceForm.ts #: src/pages/sources/plex/PlexSourceForm.ts #: src/pages/sources/saml/SAMLSourceForm.ts @@ -1847,7 +1855,6 @@ msgstr "" msgid "External Host" msgstr "" -#: src/pages/providers/proxy/ProxyProviderForm.ts #: src/pages/providers/proxy/ProxyProviderForm.ts #: src/pages/providers/proxy/ProxyProviderForm.ts msgid "External host" @@ -2336,6 +2343,10 @@ msgstr "" msgid "In case you can't access any other method." msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "In this case, you'd set the Authentication URL to auth.example.com and Cookie domain to example.com." +msgstr "" + #: src/pages/users/UserListPage.ts msgid "Inactive" msgstr "" @@ -2986,6 +2997,10 @@ msgstr "" msgid "No additional data available." msgstr "" +#: src/pages/providers/proxy/ProxyProviderViewPage.ts +msgid "No additional setup is required." +msgstr "" + #: src/elements/forms/ModalForm.ts msgid "No form found" msgstr "" @@ -3200,8 +3215,8 @@ msgid "Optionally set the 'FriendlyName' value of the Assertion attribute." msgstr "" #: src/pages/providers/proxy/ProxyProviderForm.ts -msgid "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." -msgstr "" +#~ msgid "Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +#~ msgstr "" #: src/pages/flows/BoundStagesList.ts #: src/pages/flows/StageBindingForm.ts @@ -4099,6 +4114,10 @@ msgstr "" msgid "Set custom attributes using YAML or JSON." msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "Set this to the domain you wish the authentication to be valid for. Must be a parent domain of the URL above. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'." +msgstr "" + #: src/pages/providers/proxy/ProxyProviderViewPage.ts msgid "Setup" msgstr "" @@ -4835,7 +4854,11 @@ msgid "The external URL you'll access the application at. Include any non-standa msgstr "" #: src/pages/providers/proxy/ProxyProviderForm.ts -msgid "The external URL you'll authenticate at. Can be the same domain as authentik." +#~ msgid "The external URL you'll authenticate at. Can be the same domain as authentik." +#~ msgstr "" + +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "The external URL you'll authenticate at. The authentik core server should be reachable under this URL." msgstr "" #: @@ -5760,6 +5783,10 @@ msgstr "" msgid "You're currently impersonating {0}. Click to stop." msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "app1 running on app1.example.com" +msgstr "" + #: #~ msgid "authentik Builtin Database" #~ msgstr "" @@ -5768,6 +5795,10 @@ msgstr "" #~ msgid "authentik LDAP Backend" #~ msgstr "" +#: src/pages/providers/proxy/ProxyProviderForm.ts +msgid "authentik running on auth.example.com" +msgstr "" + #: src/elements/forms/DeleteForm.ts msgid "connecting object will be deleted" msgstr "" diff --git a/web/src/pages/providers/proxy/ProxyProviderForm.ts b/web/src/pages/providers/proxy/ProxyProviderForm.ts index 0218ebe02..bff2c5169 100644 --- a/web/src/pages/providers/proxy/ProxyProviderForm.ts +++ b/web/src/pages/providers/proxy/ProxyProviderForm.ts @@ -7,6 +7,7 @@ import { ifDefined } from "lit/directives/if-defined.js"; import { until } from "lit/directives/until.js"; import PFContent from "@patternfly/patternfly/components/Content/content.css"; +import PFList from "@patternfly/patternfly/components/List/list.css"; import PFToggleGroup from "@patternfly/patternfly/components/ToggleGroup/toggle-group.css"; import PFSpacing from "@patternfly/patternfly/utilities/Spacing/spacing.css"; @@ -32,6 +33,7 @@ export class ProxyProviderFormPage extends ModelForm { return super.styles.concat( PFToggleGroup, PFContent, + PFList, PFSpacing, css` .pf-c-toggle-group { @@ -162,7 +164,7 @@ export class ProxyProviderFormPage extends ModelForm { renderSettings(): TemplateResult { switch (this.mode) { case ProxyMode.Proxy: - return html`

+ return html`

${t`This provider will behave like a transparent reverse-proxy, except requests must be authenticated. If your upstream application uses HTTPS, make sure to connect to the outpost using HTTPS as well.`}

{

`; case ProxyMode.ForwardSingle: - return html`

+ return html`

${t`Use this provider with nginx's auth_request or traefik's forwardAuth. Each application/domain needs its own provider. Additionally, on each domain, /akprox must be routed to the outpost (when using a manged outpost, this is done for you).`}

{

`; case ProxyMode.ForwardDomain: - return html`

+ return html`

${t`Use this provider with nginx's auth_request or traefik's forwardAuth. Only a single provider is required per root domain. You can't do per-application authorization, but you don't have to create a provider for each application.`}

+
+ ${t`An example setup can look like this:`} +
    +
  • ${t`authentik running on auth.example.com`}
    • +
  • ${t`app1 running on app1.example.com`}
    • +
+ ${t`In this case, you'd set the Authentication URL to auth.example.com and Cookie domain to example.com.`} +
@@ -245,10 +255,14 @@ export class ProxyProviderFormPage extends ModelForm { required />

- ${t`The external URL you'll authenticate at. Can be the same domain as authentik.`} + ${t`The external URL you'll authenticate at. The authentik core server should be reachable under this URL.`}

- + { required />

- ${t`Optionally set this to your parent domain, if you want authentication and authorization to happen on a domain level. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'.`} + ${t`Set this to the domain you wish the authentication to be valid for. Must be a parent domain of the URL above. If you're running applications as app1.domain.tld, app2.domain.tld, set this to 'domain.tld'.`}

`; } diff --git a/web/src/pages/providers/proxy/ProxyProviderViewPage.ts b/web/src/pages/providers/proxy/ProxyProviderViewPage.ts index 8165419d1..7192fffa7 100644 --- a/web/src/pages/providers/proxy/ProxyProviderViewPage.ts +++ b/web/src/pages/providers/proxy/ProxyProviderViewPage.ts @@ -92,10 +92,17 @@ export class ProxyProviderViewPage extends LitElement { renderConfigTemplate(tmpl: string): TemplateResult { // See website/docs/providers/proxy/forward_auth.mdx - const final = tmpl - .replaceAll("authentik.company", window.location.hostname) - .replaceAll("outpost.company", window.location.hostname) - .replaceAll("app.company", this.provider?.externalHost || ""); + let final = ""; + if (this.provider?.mode === ProxyMode.ForwardSingle) { + final = tmpl + .replaceAll("authentik.company", window.location.hostname) + .replaceAll("outpost.company", window.location.hostname) + .replaceAll("app.company", this.provider?.externalHost || ""); + } else if (this.provider?.mode == ProxyMode.ForwardDomain) { + final = tmpl + .replaceAll("authentik.company", window.location.hostname) + .replaceAll("outpost.company", this.provider?.externalHost || ""); + } return html`${unsafeHTML(final)}`; } @@ -233,50 +240,56 @@ export class ProxyProviderViewPage extends LitElement {
${t`Setup`}
- -
- ${this.renderConfigTemplate(MDNginxIngress.html)} -
-
- ${this.renderConfigTemplate(MDNginxPM.html)} -
-
- ${this.renderConfigTemplate(MDNginxStandalone.html)} -
-
- ${this.renderConfigTemplate(MDTraefikIngres.html)} -
-
- ${this.renderConfigTemplate(MDTraefikCompose.html)} -
-
- ${this.renderConfigTemplate(MDTraefikStandalone.html)} -
- + ${[ProxyMode.ForwardSingle, ProxyMode.ForwardDomain].includes( + this.provider?.mode || ProxyMode.Proxy, + ) + ? html` + +
+ ${this.renderConfigTemplate(MDNginxIngress.html)} +
+
+ ${this.renderConfigTemplate(MDNginxPM.html)} +
+
+ ${this.renderConfigTemplate(MDNginxStandalone.html)} +
+
+ ${this.renderConfigTemplate(MDTraefikIngres.html)} +
+
+ ${this.renderConfigTemplate(MDTraefikCompose.html)} +
+
+ ${this.renderConfigTemplate(MDTraefikStandalone.html)} +
+ + ` + : html`

${t`No additional setup is required.`}

`}
`;