Docker image + nginx reverse proxy in a folder : Loading failed for scripts

[TheEmidee]

Hello,

I'm using shaarli in docker. I have a docker-compose file where I already have a letsencrypt docker image, with an nginx configured to reverse proxy all the other services I run:

version: '3.4'
services:

  shaarli:
    image: shaarli/shaarli:latest
    container_name: shaarli
    restart: unless-stopped
    ports:
      - 8070:80
    environment:
      - PUID=1000
      - GUID=1000
    volumes:
      - ${HOME}/.config/shaarli/cache:/var/www/shaarli/cache
      - ${HOME}/.config/shaarli/data:/var/www/shaarli/data

  letsencrypt:
    image: linuxserver/letsencrypt:latest
    container_name: letsencrypt
    ports:
      - 80:80
      - 443:443
    volumes:
      - ${HOME}/.config/letsencrypt:/config
    restart:
      always
    depends_on:
      - sonarr
      - mylar
      - nzbget
      - radarr
    environment:
      - PUID=1000
      - PGID=1000
      - EMAIL=michael@emidee.net
      - URL=emidee.net
      - SUBDOMAINS=my
      - ...

The nginx config file:

server {
        listen 80;
        server_name _;
        return 301 https://$host$request_uri;
}
server {
    listen 443 ssl http2 default_server;

    root /config/www;
    index index.html index.htm index.php;

    server_name _;

    # enable subfolder method reverse proxy confs
    include /config/nginx/proxy-confs/*.subfolder.conf;

    # all ssl related config moved to ssl.conf
    include /config/nginx/ssl.conf;

    client_max_body_size 0;

    location / {
        try_files $uri $uri/ /index.html /index.php?$args =404;
    }

    location ~ \.php$ {
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        # With php7-cgi alone:
        fastcgi_pass 127.0.0.1:9000;
        # With php7-fpm:
        #fastcgi_pass unix:/var/run/php7-fpm.sock;
        fastcgi_index index.php;
        include /etc/nginx/fastcgi_params;
   }

    location /radarr
    {
        proxy_pass  http://192.168.0.1:7878;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location /shaarli
    {
        proxy_pass  http://192.168.0.1:8070;

        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  $host;
    }
}

All the services work fine, but when it comes to shaarli, the site is displayed, but it cannot load the JS or the CSS files:

Loading failed for the <script> with source “https://mywebsite.com/shaarli/plugins/qrcode/shaarli-qrcode.js”. shaarli:370:1

Any idea what could be wrong here?

Thanks

[virtualtam]

Hi @TheEmidee!

This is due to:

    location /shaarli
    {
        proxy_pass  http://192.168.0.1:8070;

        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  $host;
    }

In the Shaarli container, all resources are served on the root path: /, /index.php, etc. Your reverse proxy configuration attempts to serve Shaarli in a subpath /shaarli, thus:

• PHP code is correcly interpreted as the Shaarli/Nginx configuration redirects all PHP requests to the PHP-FPM daemon
• assets (CSS, images) are not found

For this to work you either need to:

1. serve Shaarli on its own domain
2. write a custom Docker image for Shaarli with an Nginx configuration that serves it in a subpath
3. (not recommended) configure Nginx to rewrite HTTP response bodies

I'd recommend 1. if you have your own domain and the ability to create sub-domains, else 2. which could be achieved by inheriting from the Shaarli Docker image and adding your own Nginx configuration.

[TheEmidee]

Thanks for your answer. I chose 1., the easiest :)

[TheEmidee]

[virtualtam]

You're welcome ;-)