Vue页面刷新出现404的解决方案

第一次做vue项目,在本地预览刷新都没问题,打包部署上线之后出现了一个小问题,刷新的时候会出现404

经历:百度搜索问题,原来是因为vue-router的mode使用了history模式,默认应该是hash模式

 

 

 

说明下vue-router的默认hash模式——使用URL的hash来模拟一个完整的URL,当URL改变时,页面不会重新加载。但是这种hash很丑,也不符合对URL的使用习惯。所以,需要使用另外一个叫history模式来实现URL跳转而无须重新加载页面。因为我不想要很丑的 hash,就是使用路由的 history 模式,这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。

网上给出的解决方法是修改nginx配置文件

修改nginx配置文件

1
2
3
4
5
location / {
root ...
index ...
try_files $uri $uri/ /index.html; ---解决页面刷新404问题
} 

将上面代码放入nginx配置文件中 

保存退出

 

. ./nginx -t -- 验证nginx配置文件是否正确
. ./nginx -s reload -- 重启nginx
记得修改完nginx配置文件一定要重启nginx  不然没有效果!!!

 

 

一般nginx配置文件只有负责服务器人员才可以修改,所以这个时候只需要找到负责server的同事帮忙处理就好了!!

posted @ 2020-03-26 14:56  MissCarrie  阅读(6304)  评论(0编辑  收藏  举报