vue項目history模式部署到服務(wù)器后 ，根路徑訪問沒有問題，但是進(jìn)入其他功能再刷新頁面就會出現(xiàn)404，因為你沒在nginx或者apache配置上面加上重定向跳轉(zhuǎn)。
解決辦法，只需要加上這段配置：
nginx配置內(nèi)容：
location / {
try_files $uri $uri/ @router;
index index.html;
}
location @router {
rewrite ^.*$ /index.html last;
}
apache配置內(nèi)容：
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ ./index.html [L]
這句配置的意思是每次匹配url路徑時候找不到對應(yīng)靜態(tài)資源時候調(diào)制跳轉(zhuǎn)到index.html文件
解析為什么會這樣（針對路由在history模式下）：
因為vue項目中路由hash模式改為了history模式，由于hash模式時url帶的#號后面是哈希值不會作為url的一部分發(fā)送給服務(wù)器，而history模式下當(dāng)刷新頁面之后瀏覽器會直接去請求服務(wù)器，而服務(wù)器沒有這個路由，于是就出現(xiàn)404。
因為我們的應(yīng)用是單頁客戶端應(yīng)用，當(dāng)使用 history 模式時，URL 就像正常的 url，可以直接訪問http://www.xxx.com/user/id，但是因為vue-router設(shè)置的路徑不是真實(shí)存在的路徑，所以刷新就會返回404錯誤。
想要history模式正常訪問，還需要后臺配置支持。要在服務(wù)端增加一個覆蓋所有情況的候選資源：如果 URL 匹配不到任何靜態(tài)資源，則應(yīng)該返回同一個 index.html 頁面，這個頁面就是你 app 依賴的頁面。文章來源：http://www.zghlxwxcb.cn/news/detail-510278.html
也就是在服務(wù)端修改404錯誤頁面的配置路徑，讓其指向到index.html。文章來源地址http://www.zghlxwxcb.cn/news/detail-510278.html
到了這里，關(guān)于vue項目history模式刷新404問題的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
