Angular 9 + Nginx = 404 深度链接时

Question

我正在使用 nginx.

创建一个带有 Loopback 4 后端的 Angular 9 应用程序

使用 ng serve 时，我可以毫无问题地导航到不同的页面并刷新页面。但是，在推送到登台服务器后，我可以导航该应用程序，但如果我刷新任何不是 staging.mydomain.com/ 的页面，我会收到 404 错误。

我尝试将 try_files $uri $uri/ /index.html; 添加到我的 nginx.conf 文件的 location 部分，但是当我这样做时，甚至索引页面也不再加载。

下面您将看到我的 nginx.conf 文件的 server 部分：

server {

  listen       443 ssl http2;
  listen       [::]:443 ssl http2;
  server_name  staging.mydomain.com; # managed by Certbot
  root         /usr/share/nginx/html;
  ssl_certificate /etc/letsencrypt/live/staging.mydomain.com/fullchain.pem; # managed by Certbot
  ssl_certificate_key /etc/letsencrypt/live/staging.mydomain.com/privkey.pem; # managed by Certbot

  # Load configuration files for the default server block.
  include /etc/letsencrypt/options-ssl-nginx.conf;

  add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;

  location / {
    #try_files $uri $uri/ /index.html;
    proxy_pass http://127.0.0.1:3004;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Conneciton 'upgrade';
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
  }

}

server {
  listen 80;
  server_name staging.mydomain.com;
  return 301 https://staging.mydomain.com$request_uri;
}

是否有人能够提供一些指导以使我的深层链接正常工作？

Answer 1

尝试在代理传递声明的末尾添加一个额外的 /。

location / {
    #try_files $uri $uri/ /index.html;
    proxy_pass http://127.0.0.1:3004/;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Conneciton 'upgrade';
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
  }

请注意 proxy_pass 中尾部斜杠的极端重要性，它会自动更改 $uri 变量以在前端具有 /foo与后端的 / 相对应。不需要明确的重写指令。

Answer 2

哎呀，这不是 nginx 问题。这是一个 Loopback 配置问题。

我将以下内容添加到我的 application.ts 文件以将所有未捕获的请求转发到 index.html 以供 Angular 捕获和处理。

this.static('*', path.join(__dirname, '../public/index.html'));

添加该静态路径后，一切都开始正常工作。

Angular 9 + Nginx = 404 深度链接时

Angular 9 + Ngnix = 404 when deeplinking

nginx

nginx-location

angular

loopback4

angular9