"Blocked loading mixed active content" in Blazor WebAssembly app which uses IdentityServer4

user_1804027 0
Viewed 1431

I'm trying to run default Blazor WebAssembly project template on my web server. Project, when ran locally, works without any problems. Problem appears after I deploy it to server.

I can successfully navigate to any page that doesn't require authentication. However, when I try to enter the one requiring login, I can see such message:

There was an error trying to log you in: 'Network Error'

enter image description here

In web browser console I can see:

Blocked loading mixed active content “http://[subdomain.domain.com]/.well-known/openid-configuration”

In Firefox's "Network" tab, request is marked as "Blocked".

My webserver runs on Nginx which acts as reverse proxy. I planned to keep HTTPS encryption configured between internet and Nginx. Communication between Nginx and other services were meant to be over plain HTTP. Here is my Nginx config:

server {
        listen 80;

        location / {
            return 301 https://$host$request_uri;
        }
    }

[...]
server {
        listen 443 ssl http2;
        listen [::]:443 ssl http2;
        server_name subdomain.domain.com;

        ssl_certificate /etc/nginx_ssl/live/fullchain.pem;
        ssl_certificate_key /etc/nginx_ssl/live/privkey.pem;
        ssl_session_cache builtin:1000 shared:SSL:10m;
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_ciphers HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4;
        ssl_prefer_server_ciphers on;

        location / {
            proxy_pass http://blazorapp:80;
            proxy_redirect off;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Forwarded-Host $server_name;

            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection $connection_upgrade;
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }
    }

My guesses

As you can see from browser error message, browser tries to access .well-known/openid-configuration over HTTP, not HTTPS. The problem possibly lays here.

Do you have any ideas what could be wrong?

identityserver4 blazor-client-side blazor asp.net-core nginx
2 Answers

I have the very same issue, and also would like to know the correct answer because what I've found so far seems like a mere workaround:

Add

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

to the <head> section of Client/wwwroot/index.html and Server/Pages/Shared/_Layout.shtml.

With this, the application shows "Authorizing..." and "Checking login state..." much longer than it did being accessed via http, but at least it works.

UPDATE

The previous solution was a lame workaround indeed. I think I have found a better one.

The original issue occurred because openid-configuration contained URLs using different schema: http instead of https. We can change the base URL used by IdentityServer by registering it this way in Startup.cs:

services.AddIdentityServer(
        options => {
            options.PublicOrigin = Configuration.GetValue<string>("PublicOrigin");
        })

Surely, we also have to provide a correct URL in appsettings.json:

{
  //snip
  "PublicOrigin": "https://subdomain.domain.com",
  //snip
}

Now it works just fine for me.

user_68688620

Adding the following line to startup.cs Configure method:

app.Use((ctx, next) => { 
    ctx.SetIdentityServerOrigin("https://IdsrvDomain.com"); 
    return next(); 
});
user_17126300
Related