在子页面上提供静态文件会导致 nginx 中到处都出现 404

在子页面上提供静态文件会导致 nginx 中到处都出现 404

我有一个 Docker 容器,其中有 Nginx,为 的静态 SPA 网站提供服务/
以下是完整配置 ( /etc/nginx/conf.d/default.conf):

server {
    listen       80;
    server_name  localhost;

    location / {
        root   /usr/share/nginx/html;
        try_files $uri $uri/ /index.html;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

现在,我需要将应用程序改为 而不是 ,/而是/app(目前完全不需要 root 用户)。这似乎很简单,所以我将location / {其改为 ,但它不起作用,现在和location /app/ {都得到 404 。//app/

新的配置文件如下所示:

server {
    listen       80;
    server_name  localhost;

    location /app/ {
        root   /usr/share/nginx/html;
        try_files $uri $uri/ /index.html;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

只是做了一点小改动,但现在什么都不起作用了。我做错了什么?

编辑:服务器日志:

2022/06/30 12:57:29 [error] 31#31: *1 open() "/etc/nginx/html/app" failed (2: No such file or directory), client: 172.17.0.1, server: localhost, request: "GET /app HTTP/1.1", host: "localhost:8000"
172.17.0.1 - - [30/Jun/2022:12:57:29 +0000] "GET /app HTTP/1.1" 404 555 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36" "-"
2022/06/30 12:57:29 [error] 31#31: *1 open() "/etc/nginx/html/favicon.ico" failed (2: No such file or directory), client: 172.17.0.1, server: localhost, request: "GET /favicon.ico HTTP/1.1", host: "localhost:8000", referrer: "http://localhost:8000/app"
172.17.0.1 - - [30/Jun/2022:12:57:29 +0000] "GET /favicon.ico HTTP/1.1" 404 555 "http://localhost:8000/app" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36" "-"
2022/06/30 12:57:30 [error] 31#31: *1 open() "/etc/nginx/html/app" failed (2: No such file or directory), client: 172.17.0.1, server: localhost, request: "GET /app HTTP/1.1", host: "localhost:8000"
172.17.0.1 - - [30/Jun/2022:12:57:30 +0000] "GET /app HTTP/1.1" 404 555 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36" "-"
2022/06/30 12:57:30 [error] 31#31: *1 open() "/etc/nginx/html/favicon.ico" failed (2: No such file or directory), client: 172.17.0.1, server: localhost, request: "GET /favicon.ico HTTP/1.1", host: "localhost:8000", referrer: "http://localhost:8000/app"
172.17.0.1 - - [30/Jun/2022:12:57:30 +0000] "GET /favicon.ico HTTP/1.1" 404 555 "http://localhost:8000/app" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36" "-"

在日志中,我看到它尝试从/etc/nginx/html而不是获取应用程序/usr/share/nginx/html。我已将属性root设置为/usr/share/nginx/html,为什么它会尝试从 获取这些文件/etc?如果我将我的网站移动到 ,/etc/nginx/html它就可以正常工作。

答案1

我解决了这个问题,只需稍微改变配置:

server {
    listen       80;
    server_name  localhost;

    root   /usr/share/nginx/html;

    location /app/ {
        alias /usr/share/nginx/html;
                try_files $uri $uri/ /index.html =404;
    }

    location ~ ^/app(.*) {
                root /usr/share/nginx/html;
                try_files $1 $1/ /index.html =404;
        }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

首先 - 我需要root顶层的属性,然后加载index.html成功,但其他所有内容(如favicon.png)也与内容一起返回index.html,因此第二个location内容为~ ^/app(.*)。我怀疑应该有更好的解决方案,但这个对我来说很有效。

相关内容