Nginx config SPA

Question

我需要有关SPA的Nginx配置的一些帮助。我是用自己设法在Google上搜索的作品制作的，但我不知道它是如何工作的。

我需要：

1）服务静态文件

location ~ \.(css|js|svg|woff|woff2|ico|ttf|eot|jpe?g|png|txt)$ {          
  try_files $uri $uri/ =404;
  expires 1y;
  add_header Cache-Control "public"; 
}

[如果找不到该文件，则返回404。如果我只是在URL中键入错误的文件名，那没关系，但是如果我在index.html中而不是404页面中键入了错误的文件名，则会得到一个空白页。应该这样吗？

2）对/ api的请求需要重定向到Node后端

location /api {
  try_files '' @proxy;
}

location @proxy  {
  proxy_pass http://localhost:3000;
}

我不太确定这行，如果应该这样看的话

try_files '' @proxy;

3）和最大的问题，不匹配的请求需要返回index.html

location / {
  try_files '' /index.html;
  expires -1;
}

location = /index.html {
  expires -1;
}

据我了解，第一个块将所有未知请求重定向到index.html，但我不明白第二个块如何为index.html提供服务。我不写服务该文件，没有try_files指令。

Answer 1

1）服务静态文件

您的解决方案非常好。仅在您需要为这些URI设置不同的缓存控制和到期标头时才需要。 try_files语句是不必要的，因为它与默认行为相同。

2）对/ api的请求需要重定向到Node后端

您的解决方案可以简化为：

location /api {
    proxy_pass http://localhost:3000;
}

这将处理任何以/api开头的URI，除非它与步骤（1）中的正则表达式匹配。您可以使用^~运算符避免这种情况。有关详细信息，请参见this document。

3）和最大的问题，不匹配的请求需要返回index.html

通常通过以下方式实现：

location / {
    try_files $uri $uri/ /index.html;
    ...
}

除非请求与其他任何location或文件或目录匹配，否则URI将在内部重写为/index.html。有关详细信息，请参见this document。