一、try_files vue
在vue环境下，try_files用于定义Nginx文件系统中查找请求的文件路径和文件类型的优先顺序。
location / {
try_files $uri $uri/ /index.html;
}
以上代码的意思是，优先查找请求的文件，如果找不到则查找以请求文件名为前缀的目录，最后如果仍然找不到则使用index.html文件作为返回。
Vue cli提供了使用history模式的路由方法，在生产环境中需要配置Nginx才能够使用。具体方法是在Nginx中使用try_files指令。
二、try_files $uri
如果条件比较简单，只是需要返回一个相同的文件，可以使用try_files $uri $uri/代替if语句。
location / {
try_files $uri $uri/ /index.html;
}
以上代码表示查找请求的文件，如果找不到则查找以请求文件名为前缀的目录，如果仍然找不到则使用index.html文件作为返回。
三、try_files 过滤
使用try_files指令进行过滤文件。将所有文件通过正则表达式过滤，只在目录下查找.html、.css、.js后缀的文件。如果匹配不到则使用index.html。
location / {
try_files $uri $uri/ /index.html;
}
以下的代码表示只在目录下查找.html、.css、.js后缀的文件，如果匹配不到则使用index.html。
location / {
try_files $uri $uri/ /index.html;
}
四、try_files react
在React环境下，使用try_files指令来配置Nginx服务器，以实现SPA应用程序的路由管理。
location / {
try_files $uri /index.html;
}
以上代码意思是，在请求的URL中查找与Nginx服务器中存在的URL匹配的配置文件，如果不存在则从/index.html中返回。这是SPA应用程序的典型配置。
五、try_files 坑
在使用try_files指令时，经常可能会遇到一些问题，下面列出一些可能的坑：
- try_files指令只with-try-files可能使用once或multiple参数值
- 使用`/`因为会使Nginx子请求开销很高，因此需要使用if或map模块
- 不要使用try_files指令处理PHP或Fastcgi应用程序，因为这会导致PHP/Fastcgi subprocess的开销
由于Nginx有很多的if语句，但是if过于复杂或嵌套太多，否则会降低性能。
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/198720.html
微信扫一扫 
支付宝扫一扫 