Nginx 服务 Angular returns 404

Question

我正在尝试通过 nginx 运行生产构建的 Angular 应用程序。目前，我可以很好地为 index.html 提供服务，但问题是所有 *.js 和 *css 被引用为索引本身内部的源，那些 return 是 404 错误。我一直在使用 root 或别名在不同的配置之间来回切换，但 none 似乎可以解决问题。

首先，我使用以下方法构建应用：

ng build --configuration production --aot

注意：上述命令会创建一个 dist 文件夹，其中包含运行应用程序所需的所有文件，然后我移动所有这些文件到路径 /apps/customer-ui

文件夹结构如下：

/apps
  /customer-ui
    /index.html
    /(all other files resulting from build)

这是我的nginx.conf

...

http {

    ...
    
    server {
        listen 80;
        server_name localhost;
        root /apps;
        index index.html;
        
        location / { }
        
        location ^~/customer-ui {
            alias /apps/customer-ui/;
            try_files $uri $uri/ /customer-ui/index.html =404;
        }
        
    }
}

目前，访问 http://localhost/customer-ui returns 是正确的索引，但也是上面提到的 404，因为引用指向 http://localhost/filename.js 而不是http:///localhost/customer-ui/filename.js

Console errors here

非常感谢任何帮助。

Answer 1

由于所有必需的文件都在 customer-ui 目录中，因此最好将所有路径都指向那里，如下所示：

        root /apps/customer-ui;
        index index.html;
        
        location / {
            try_files $uri $uri/ /index.html =404;
        }

或者，您可以使用这个（不推荐，因为它相当混乱）：

        root /apps;
        index index.html;
        
        location / {
            alias /apps/customer-ui/;
            try_files $uri $uri/ index.html =404;
        }

Nginx 服务 Angular returns 404

Nginx serving Angular returns 404

nginx

angular