CSS/JS 文件未通过 Nginx 从服务器显示到反向代理 OctoPrint 服务器

Question

我在网站 https://example.com 上有一个 Nginx 服务器运行。我正在尝试通过反向代理在我 own/admin 的另一台远程服务器上提供一个页面（来自 OctoPi），服务于 http://1.2.3.4:1988.

我可以在 https://example.com/foo/ 提供主页，但是 css 和 js 文件没有加载。控制台显示 https://example.com/foo/static/webassets/packed_libs.css 等文件出现 404 错误。如果我访问 https://1.2.3.4:1988/foo/static/webassets/packed_libs.css，我可以读取 css 文件。

我确定我在 /etc/nginx/sites-available/default 中的 nginx 配置文件可能是 fubar-ed，但我似乎无法弄清楚在哪里，因为错误和访问日志都没有暴露任何错误，haproxy 也没有登录OctoPi。

Nginx 配置文件：

server {
    listen 80;
    server_name www.example.com;
    listen [::]:80 default_server;
    return  301 https://example.com$request_uri;
}

server {
    listen 443 ssl;
    server_name www.example.com;
    return 301 https://example.com$request_uri;
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; 

    # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
    server_name www.example.com;
    return 301 https://example.com$request_uri;
}

server{
    listen 80;
    server_name example.com;
    root /var/www/example.com/public;

    location / {
        try_files $uri $uri/ /index.php$is_args$args;
        include /etc/nginx/mime.types;
        default_type application/octet-stream;
    }

    location ^~ /foo {
        # Redirecting via reverse proxy to OctoPi server
        proxy_pass http://1.2.3.4:1988/;
        proxy_redirect default;
        proxy_set_header Host $host;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        include mime.types;
        sub_filter '/i18n/' '/foo/i18n/';
        sub_filter '/static/'  '/foo/static/';
        sub_filter_once off;
    }

    location /foo/sockjs {
        proxy_pass http://1.2.3.4:1988/;
        proxy_http_version 1.1;
        proxy_redirect off;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }

    error_page 404 /404.html;
    error_page 500 502 503 504 /50x.html;

    location = /50x.html {
        root /var/www/example.com/public;
    }

    location ~ \.php$ {
        include snippets/fastcgi-php.conf;

        # With php7.0-cgi alone:
        # fastcgi_pass 127.0.0.1:9000;
        # With php7.0-fpm:
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
    }

    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
    if ($scheme != "https") {
        return 301 https://$host$request_uri;
    } # managed by Certbot

}

Answer 1

我在这里找到了我的问题的文档：https://github.com/foosel/OctoPrint/wiki/Reverse-proxy-configuration-examples

我将包括相关部分供后代使用：

server {
            listen       80;
            server_name  localhost;

            location /foo {
                proxy_pass http://1.2.3.4:1988; # NO trailing slash here!
                proxy_set_header Host $http_host;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header X-Scheme $scheme;

                client_max_body_size 0;    
            }
            ...

但是，我已经转回 Apache，因为我更熟悉它的设置和使用。

CSS/JS 文件未通过 Nginx 从服务器显示到反向代理 OctoPrint 服务器

CSS/JS files not showing from server to reverse-proxy OctoPrint server via Nginx

css

reverse-proxy

nginx

octoprint