I am running metabase with nginx with the following configuration: /etc/nginx/sites-available/example.com
server {
# SSL configuration
listen 443 ssl http2;
listen [::]:443 ssl http2;
ssl on;
ssl_certificate /etc/ssl/certs/cert.pem;
ssl_certificate_key /etc/ssl/private/key.pem;
ssl_client_certificate /etc/ssl/certs/cloudflare.crt;
ssl_verify_client on;
server_name example.com www.example.com;
root /var/www/example.com/html;
index index.html index.htm index.nginx-debian.html;
location / {
proxy_pass http://127.0.0.1:3000/;
}
}
This works with Cloudflare with both Full
and Full(strict)
settings having Always Use HTTPS
and Automatic HTTPS Rewrites
both ON and Rocket Loader™
OFF
If I try to run the proxy_pass
on a non-root location for example
location /metabase/
{
proxy_pass http://127.0.0.1:3000/;
}
I get (in Firefox console):
The resource from “https://example.com/app/dist/app-main.bundle.css?4ccd5c23fd3dcf61a206fe52be657d90” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
The resource from “https://example.com/app/dist/styles.bundle.css?dcf6d19a625c0113333c2f87a9aaef16” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
The resource from “https://example.com/app/dist/styles.bundle.js?3f8f0db4d958de85c2e9” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
The resource from “https://example.com/app/dist/vendor.bundle.js?3f8f0db4d958de85c2e9” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
In chrome console
Refused to apply style from 'https://example.com/app/dist/vendor.bundle.css?69e4c60679defb49c969e3d7051532f1' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled
....
And the page is blank because no stylesheet or javascript is loaded :(.
There is a solution to a similar problem but it’s on apache. Is there anything similar on nginx?
I don’t know for sure if it’s a nginx issue or Cloudflare or a combination of both.