一、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過于復雜或嵌套太多,否則會降低性能。