vue刷新404的問題解決方法

這篇文章帶給大家的內容是關於vue刷新404的問題解決方法，有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

1、問題描述

利用vue-route結合webpack編寫了一個單頁路由項目，維運協助在伺服器端設定nginx。部署完成後，訪問首頁沒問題，從首頁打開二級頁面沒問題，但是所有的二級頁面打開後，再次刷新，就會出現404現象！

2. 問題原因：

刷新頁面時存取的資源在服務端找不到，因為vue-router設定的路徑不是真實存在的路徑。

3. 解決方法：

在nginx設定裡加入vue-route的跳躍設定（這裡首頁是index.html，如果是index.php就在下面對應位置替換），正確配置如下

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

location @router {
    rewrite ^.*$ /index.html last;
}

這篇文章到這裡就已經全部結束了，更多其他精彩內容可以關注PHP中文網的JavaScript教學影片欄位！

以上是vue刷新404的問題解決方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！