vue刷新404

Euphoria 發(fā)布于2019-08-26 18:18 / 3094人閱讀

摘要：部署完成后，訪問首頁沒問題，從首頁里打開二級頁面沒問題，但是所有的二級頁面打開后，再次刷新，就會出現(xiàn)現(xiàn)象問題原因刷新頁面時訪問的資源在服務(wù)端找不到，因為設(shè)置的路徑不是真實存在的路徑。

1. 問題描述

利用vue-route結(jié)合webpack編寫了一個單頁路由項目，運維協(xié)助在服務(wù)器端配置nginx。部署完成后，訪問首頁沒問題，從首頁里打開二級頁面沒問題，但是所有的二級頁面打開后，再次刷新，就會出現(xiàn)404現(xiàn)象！

2. 問題原因：

刷新頁面時訪問的資源在服務(wù)端找不到，因為vue-router設(shè)置的路徑不是真實存在的路徑。

3. 解決方法：

在nginx配置里添加vue-route的跳轉(zhuǎn)設(shè)置（這里首頁是index.html，如果是index.php就在下面對應(yīng)位置替換），正確配置如下

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

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

GPU云服務(wù)器云服務(wù)器 cdn刷新緩存報404 網(wǎng)站404 打開404 404

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/110182.html

相關(guān)文章

vue路由history模式刷新頁面出現(xiàn)404問題

摘要：模式下，中存在，用模式就能解決這個問題。但是模式會出現(xiàn)刷新頁面后，頁面出現(xiàn)。解決的辦法是用配置一下。 vue hash模式下，URL中存在#，用history模式就能解決這個問題。但是history模式會出現(xiàn)刷新頁面后，頁面出現(xiàn)404。解決的辦法是用nginx配置一下。在nginx的配置文件中修改方法一： location /{ root /data/nginx/html...

sanyang 2019-07-25 14:28 評論0 收藏0
42. Vue、React 等前端項目部署，刷新 404 問題解決方案

摘要：發(fā)現(xiàn)路徑下是靜態(tài)文件的目錄，不是的目錄沒有文件，就會規(guī)則，返回這樣瀏覽器拿到之后，開始加載其中的前端路由部分這時候就會在前端路由中找到匹配規(guī)則同理也可以寫在前端路由中了首發(fā)于我的github博客, 歡迎關(guān)注nginx 匹配的 try_file 與前端路由的優(yōu)先級問題場景描述: 訪問www.abc.com，之后點擊界面里面的logout，前端路由處理，跳轉(zhuǎn)到www.abc.c...

caiyongji 2019-07-25 14:38 評論0 收藏0
配置nginx解決vue路由history模式下刷新404問題

摘要：在路由模式為的時候，刷新頁面會出現(xiàn)問題。我們只需要在服務(wù)器配置如果匹配不到任何靜態(tài)資源，就跳轉(zhuǎn)到默認(rèn)的。表示你監(jiān)聽的端口號打包后的文件夾目錄在vue路由模式為history的時候，刷新頁面會出現(xiàn)404問題。我們只需要在服務(wù)器配置如果URL匹配不到任何靜態(tài)資源，就跳轉(zhuǎn)到默認(rèn)的index.html。 server { listen 8105; // 表示你nginx監(jiān)聽...

stormzhang 2019-07-25 14:27 評論0 收藏0
vue router 刷新404問題

摘要：問題描述單頁面應(yīng)用的項目，設(shè)置模式為。可以跳轉(zhuǎn)但刷新了頁面，則顯示為。但是這種很丑，也不符合對的使用習(xí)慣。所以，需要使用另外一個叫模式來實現(xiàn)跳轉(zhuǎn)而無須重新加載頁面。服務(wù)器配置服務(wù)器配置 1. 問題描述單頁面應(yīng)用的vue項目，設(shè)置router模式為history。可以跳轉(zhuǎn)但刷新了頁面，則顯示為404。 vue-router的默認(rèn)hash模式使用URL的hash來模擬一個完整的URL...

zilu 2019-08-23 14:34 評論0 收藏0
vue項目路由在history模式下布置在Tomcat下解決刷新404問題

摘要：首先打包之前需要修改文件夾下的其次記得要添加路由頁面在的下的前端文件夾下新建文件夾，并在該文件夾下建立文件，具體內(nèi)容如下 1、首先打包之前需要修改config文件夾下的index.js showImg(https://segmentfault.com/img/bVbnqP7?w=872&h=303); 2、其次記得要添加404路由頁面 showImg(https://segmentfa...

luckyyulin 2019-08-23 14:48 評論0 收藏0