vue路由history模式刷新404問題解決方案

vue單頁因微信分享和自動登錄需要，對於URL中存在’#’的地址，處理起來比較坑。用history模式就不會存在這樣的問題。但是換成history模式，就會有個新的問題，就是頁面刷新后，頁面就無法顯示了（404）。對於這個問題，我們只需要在服務器配置如果URL匹配不到任何靜態資源，就跳轉到默認的index.html。
我這里是針對nginx的配置，總結如下：

一 （這種方式容易被第三方劫持）

location /{
        root   /data/nginx/html;
        index  index.html index.htm;
        error_page 404 /index.html;
}

二

    location /{
        root   /data/nginx/html;
        index  index.html index.htm;
        if (!-e $request_filename) {
            rewrite ^/(.*) /index.html last;
            break;
        }
    }

三

 server {
        listen       8888;#默認端口是80，如果端口沒被占用可以不用修改
        server_name  localhost;
        root        E:/vue/my_project/dist;#vue項目的打包后的dist
        location / {
            try_files $uri $uri/ @router;#需要指向下面的@router否則會出現vue的路由在nginx中刷新出現404
            index  index.html index.htm;
        }
        #對應上面的@router，主要原因是路由的路徑資源並不是一個真實的路徑，所以無法找到具體的文件
        #因此需要rewrite到index.html中，然后交給路由在處理請求資源
        location @router {
            rewrite ^.*$ /index.html last;
        }
        #.......其他部分省略
  }

　　

————————————————
版權聲明：本文為CSDN博主「tony_xf」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/u011025083/java/article/details/80352301