vue-element-admin 之解决路由开启 Histroy 模式,刷新跳首页问题

289 阅读1分钟

为什么开启 Histroy 模式

- 原因是不开启 Histroy 模式,默认 hash 模式下路由路径上会带 # 号,强迫症会觉得不美观,不符合正常的 URL 写法
![](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/92c412ef5a294af3917ddc45473219cd~tplv-k3u1fbpfcp-zoom-1.image)

开启 Histroy 导致的问题

- 正常情况下页面刷新后应该是停留在当前页,开启 Histroy 模式后,刷新页面会由于 URL 匹配不到任何静态资源导致跳转到首页,没用前端框架或者配置有问题,干脆直接就 404 了

解决方案

- 修改 Nginx 配置
location / {
  #根目录位置
  root   /usr/share/nginx/html;
  #index 文件位置
  #index  index.html;
  try_files $uri $uri/ /index.html;
}