Allow iframe embedding / respect Content-Security-Policy header

[Ra72xx]

Is your feature request related to a problem? Please describe. Currently it seems not to be possible to embed pages/services protected with Authentik as iframes in other pages. E.g. I embed several pages/services as external pages in Nextcloud, which is currently only possible when opening them in a new tab, not within the Nextcloud ui. This seems to be a recent change, as I remember this working in previous Authentik versions. Nginx config contains the line add_header Content-Security-Policy "frame-ancestors 'self' 'https://mynextclouddomain:port;" always; both for the authenik domain and the domain of the protected pages, but this does no longer work.

Describe the solution you'd like The CSP header set by protected pages should be used by Authentik, too

Describe alternatives you've considered Open the protected sites in a new tab.

[Healzangels]

Been trying to setup something very similar. I've added proxy_hide_header X-Frame-Options; to the reverse proxy of my auth site.

This gets me to see the auth page within my iframe however I go into an endless loop with the auth loading screen.

I'm not sure if this is the same thing you are seeing but thought would addon here as trying to ultimately achieve something similar. Thanks!

[idc77]

Is it still not possible to set X-FRAME-OPTIONS and CSP?

[Ra72xx]

I had it kind of working in many use cases with some custom csp headers injected by Nginx proxy, but something always didn't work, e.g. in my latest setup everything worked but no webauthn device could be registered when in an iframe. So I kind of gave up on this subject in order not to provoke security risks because of my fiddling around. I wait for an official way to do this.

[joe-eklund]

I deployed Authentik for the first time today and am still learning. Pretty awesome software from what I can tell.

Regarding this issue, I was able to get Authentik working inside an iframe by setting these headers in my Traefik middleware:

      - "traefik.http.middlewares.authentik-middleware.headers.contentSecurityPolicy=frame-ancestors mydomain.tld"
      - "traefik.http.middlewares.authentik-middleware.headers.customFrameOptionsValue=allow-from https://*.mydomain.tld"
      - "traefik.http.middlewares.authentik-middleware.headers.customrequestheaders.X-SCHEME=https"

This allows me to login to my Authentik dashboard inside an iframe with Organizr, as well as applications that are also iframed in Organizr. I actually suspect only the first two headers are needed, but I haven't tested removing the last one just yet.

[Ra72xx]

I also had some Nginx headers which enabled running Authentik in an iframe (Nextcloud) at the first glance. Only later I noticed that some things simply didn't work this way, e.g. registering a webauthn device.

[joe-eklund]

Gotcha. I haven't yet tested that just yet, but I will be testing out webauthn and Nextcloud soon. I'll let you know my findings.

[BeryJu]

This will be possible with https://github.com/goauthentik/authentik/pull/9257 or https://github.com/goauthentik/authentik/pull/8994

[fooware]

@BeryJu: Any news on this? There doesn't seem to have been any updates in the two tickets after they were created.

[roschaefer]

I think there is a workaround for this problem. You create a file in /data/user_settings.py with the following content:

X_FRAME_OPTIONS = "allow-from *"

Read the docs about user_settings.py.

I believe the way how this hack works is that browsers will simply ignore the header which would be equivalent of not having the header at all (because at the moment you cannot instruct authentik to not send it).

The better solution would be to configure a CSP frame:ancestors header.

[fooware]

This will be possible with #9257 or #8994

9257 was merged last week, but as far as I can see CSP was not part of that MR (anymore?). Just an FYI if anyone else is waiting for it.

[m33ts4k0z]

This will be possible with #9257 or #8994

9257 was merged last week, but as far as I can see CSP was not part of that MR (anymore?). Just an FYI if anyone else is waiting for it.

Its the #8994 that contains the fix and is a from a different branch. That one is not merged yet. Any news? @BeryJu

For the time being, attaching this middleware to all your routes in traefik should solve all your problems ( Havent yet tried enrolling a mfa device though):

UPDATE: webauthn enrollment seems to work on desktop but shows an error on mobile: Failed to register, please try again

securityHeaders:
  headers:
    customResponseHeaders:
      X-Robots-Tag: "none,noarchive,nosnippet,notranslate,noimageindex"
      X-Forwarded-Proto: "https"
      server: ""
    sslProxyHeaders:
      X-Forwarded-Proto: https
    customRequestHeaders:
      X-Forwarded-Proto: "https"
      X-Scheme: "https"
    forceSTSHeader: true
    stsIncludeSubdomains: true
    stsSeconds: 63072000
    stsPreload: true
    contentSecurityPolicy: "frame-ancestors https://*.domain.tld"
    customFrameOptionsValue: "ALLOW-FROM https://*.domain.tld"

[Mrs-Feathers]

looks like its just waiting on being linted!

i'm pretty excited for this update too, because ive been trying to integrate authentik proxy protected services in my Home Assistant as well as an all in one community dashboard. my community uses authentik for OIDC and SSO for EVERYTHING so before this update, nothing would allow anyone to login via iframes. im hoping after, since ive set most things up to automatically authorize with OIDC when its loaded that i can set everything i need to in iframes and ill have one big hub for the community to play with all in one place!

[Oriann]

Any news on this ? Headers are still not respected...