Mixed Content error because of Keycloak default login redirection

Question

INFORMATION NEEDED:

I use Keycloak (Docker version) behind a Spring project.

(The client side of this project is React and communication between client and backend is provided by REST services.)

The client side is secured and using "https" scheme.

It is my Spring configuration:

  keycloak:
     auth-server-url: https://sso-ssoha.b9ad.pro-us-east-1.openshiftapps.com/auth
     realm: master
     resource: clientname
     public-client: true

THE ROOT OF THE PROBLEM:

When I click a link from client, it calls a Spring service normally. But before that, it redirects to default login page of Keycloak with adding this path sso/login to the current "https" url but changing scheme to "http".

But, redirecting from https to http create a problem like this:

Mixed Content: The page at 'https://www.helpful.army/contents/Problem' was loaded over HTTPS, but requested an insecure resource 'http://serviceha-helpfularmy.b9ad.pro-us-east-1.openshiftapps.com/sso/login'. This request has been blocked; the content must be served over HTTPS.

Answer 1

it seems that we need let keycloak web server aware of we are using proxy, https://serverfault.com/questions/1000567/keycloak-blank-page-behind-nginx-reverse-proxy, after set PROXY_ADDRESS_FORWARDING variable, it works.

Answer 2

I have solved this problem and similar ones with these steps:

(1) Frontend side:

You know, www.helpful.army is an educational project which has an interface running on React and it is in NGINX server. So, I appended the default NGINX server config with mandatory headers:

location / {
        try_files $uri /index.html;
        proxy_set_header X-Forwarded-Proto $scheme;
        **add_header Access-Control-Allow-Origin *;**

    }

(2) Backend side:

I have created a different client on Keycloak just for the Spring-Boot backend and set is as a "Bearer-only" one.

keycloak:
 auth-server-url: https://sso-ssoha.b9ad.pro-us-east-1.openshiftapps.com/auth
 realm: master
 resource: serviceha
 bearer-only: true
 ssl-required: "external"
 confidential-port: 0
 verify-token-audience: true

I also add this configuration for application.yml:

 server:
    port: 8443
    remote_ip_header: x-forwarded-for
    protocol_header: x-forwarded-proto
    use-forward-headers: true

(3) I have changed all ports from interface to backend as 8443