Keycloak-angular x-frame issue

Question

I have the following issue after setting up Angular-keycloak:

Refused to display 'http://localhost:4200/' in a frame because it set 'X-Frame-Options' to 'deny'.

My Angular (app.module.ts) configuration is the following:

        keycloak.init({
          config: {
            // url: 'http://localhost:8080/auth',
            url: window.location.origin + '/auth',
            realm: 'myRealm',
            clientId: 'my-client',
          },
          initOptions: {
            onLoad: 'login-required',
            // onLoad: 'check-sso',
            // checkLoginIframe: false
            // silentCheckSsoRedirectUri:
            //   window.location.origin + '/assets/silent-check-sso.html',
          },
          loadUserProfileAtStartUp: true,
          bearerExcludedUrls: ['']
        }))

The keycloak server is running on port 8080.

If I access Keycloak directly

url: 'http://localhost:8080/auth'

everything works fine, I can see the Keycloak login prompt and get a token.

If I use

url: window.location.origin + '/auth',

and use a proxy server (spring cloud gateway or proxy.conf.json in dev) to redirect to Keycloak, I get this X-Frame error.

I can see the request in the proxy and the following call is successful:

Request URL: http://localhost:4200/auth/realms/IzoaKeycloak/protocol/openid-connect/3p-cookies/step1.html Request Method: GET Status Code: 200 OK

however the response header contains:

X-Frame-Options:DENY

Is this a setup in Keycloak that I am missing?

06/12/2023 update

So it looks like the issue is with the Spring-cloud-gateway that adds the X-Frame-Options:DENY per default.

I tried to disable it by adding the following to my application.yml

routes:
 - id: keycloak
              uri: http://keycloak:8080/auth
              predicates:
              - Path=/auth/**
              filters:
              - RemoveResponseHeader=X-Frame-Options

but the X-Frame-Options:DENY is still there.