角9+ Ngnix = 404

Question

我正在使用Angular 9创建一个Loopback 4后端的nginx应用程序。

在使用ng serve时，我可以导航到不同的页面，并在没有问题的情况下刷新页面。然而，在推到暂存服务器之后，我可以导航应用程序，但是如果刷新任何不是staging.mydomain.com/的页面，我会得到一个404错误。

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

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

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

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

我将以下内容添加到我的application.ts文件中，将所有未处理的请求转发给index.html，以便进行角度捕获和处理。

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

一旦我添加了静态路径，一切就开始正常工作了。

Answer 2

尝试在代理pass语句的末尾添加一个额外的/。

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与后端的/相对应。不需要显式重写指令.