Reverse proxy with nginx gives a black screen

1

I’m stuck with my first influxdb installation (well, not really first because long ago I had a working setup with InfluxDB v1)

My setup is a Incus (LXC) container with Ubuntu24. It has its own DNS entry. There is a Letsencrypt certificate. I’ve installed Ubuntu/Debian package influxdb2 2.7.12-2

I want to use nginx proxy, because influxdb (through systemctl) runs with user influxdb and that user cannot read the letscrypt key.

nginx proxy should work, but I’m getting a black screen. This is with Firefox and Chromium. SSL (https) seems to be OK because with wget or curl there are no errors. I see

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="InfluxDB is a time series platform, purpose-built by InfluxData for storing metrics and events, provides real-time visibility into stacks, sensors, and systems."><title>InfluxDB</title><base href="/"><base href=""><link rel="icon" href="/favicon.ico"></head><body><div id="react-root" data-basepath=""></div><script defer="defer" src="/64a6202951.js"></script></body></html>

Also 64a6202951.js is returned when using wget or curl.

I’m hoping there is somebody here who can guide me to debug this.

Here is my nginx config

# Redirect HTTP to HTTPS
server {
    server_name influx.example.com;

    listen 80;
    listen [::]:80;

    #include letsencrypt.conf;
    # ACME-challenge
    location ^~ /.well-known/acme-challenge/ {
        root /var/www/_letsencrypt;
    }

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

server {
    server_name influx.example.com;

    listen [::]:443 ssl ipv6only=on;    # managed by Certbot
    listen 443 ssl;                     # managed by Certbot

    ssl_certificate /etc/letsencrypt/live/influx.example.com/fullchain.pem;     # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/influx.example.com/privkey.pem;   # managed by Certbot
    ssl_trusted_certificate /etc/letsencrypt/live/influx.example.com/chain.pem;
    #include /etc/letsencrypt/options-ssl-nginx.conf;                            # managed by Certbot
    ssl_session_cache shared:le_nginx_SSL:10m;
    ssl_session_timeout 1440m;
    ssl_session_tickets off;

    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_prefer_server_ciphers off;

    ssl_ciphers "ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384";
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;                              # managed by Certbot

    # security
    #include                 security.conf;
    # security headers
    add_header X-XSS-Protection          "1; mode=block" always;
    add_header X-Content-Type-Options    "nosniff" always;
    add_header Referrer-Policy           "no-referrer-when-downgrade" always;
    add_header Content-Security-Policy   "default-src 'self' http: https: ws: wss: data: blob: 'unsafe-inline'; frame-ancestors 'self';" always;
    add_header Permissions-Policy        "interest-cohort=()" always;
    add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;

    # . files
    location ~ /\.(?!well-known) {
        deny all;
    }

    # logging
    access_log              /var/log/nginx/access.log combined buffer=512k flush=1m;
    error_log               /var/log/nginx/error.log warn;

    # reverse proxy
    location / {
        proxy_pass          http://localhost:8086;
	proxy_set_header    Host    $host;
	#include             proxy.conf;
    }

    # additional config
    #include general.conf;
    # favicon.ico
    location = /favicon.ico {
        log_not_found off;
    }

    # robots.txt
    location = /robots.txt {
        log_not_found off;
    }

    ## assets, media
    #location ~* \.(?:css(\.map)?|js(\.map)?|jpe?g|png|gif|ico|cur|heic|webp|tiff?|mp3|m4a|aac|ogg|midi?|wav|mp4|mov|webm|mpe?g|avi|ogv|flv|wmv)$ {
    #    expires 7d;
    #}

    # svg, fonts
    location ~* \.(?:svgz?|ttf|ttc|otf|eot|woff2?)$ {
        add_header Access-Control-Allow-Origin "*";
        expires    7d;
    }

    # gzip
    gzip            on;
    gzip_vary       on;
    gzip_proxied    any;
    gzip_comp_level 6;
    gzip_types      text/plain text/css text/xml application/json application/javascript application/rss+xml application/atom+xml image/svg+xml;
}
2

A few things I’ve tried

Using these URLs give me the correct initial opening screen in Firefox:

  • http://-ipv4-address-:8086/
  • http://[-ipv6-address-]:8086/
  • http://-influx.fritz.box-:8086/ ← this is a hostname in my local network

The following URL somehow automatically turns on TLS and fails. The URL in the address bar of Firefox is changed to https. I’ve searched for ways to suppress this automation, but non of the suggested configuration items changed this behaviour.

  • http://-influx.example.com-:8086/
3

I think I found which nginx conf is causing this.

If this line is removed (commented out), then it works

    add_header Content-Security-Policy   "default-src 'self' http: https: ws: wss: data: blob: 'unsafe-inline'; frame-ancestors 'self';" always;
4

It looks like this problem was discussed earlier. Several people report the same problem. Nobody seems to know that Content-Security-Policy causes the black screen.