ThinkPHP5和Vue项目刷新页面出现404错误如何解决？

thinkphp5 与 vue 前端刷新页面报 404 错误的解决方法

在使用 thinkphp5 作为后端和 vue.js 作为前端开发时，遇到了刷新页面出现 404 错误的情况。具体表现为：在前端代码打包后，将其放置在 public 文件夹下后，刷新页面就会报错。

问题分析

这个问题产生的原因在于，nginx 的配置没有正确处理刷新页面时的路由。由于前端使用的是 history 模式，刷新时不会触发后端路由，而是直接请求前端代码对应的路径。如果 nginx 配置中没有针对这些路径的处理规则，就会报 404 错误。

解决方法

为了解决这个问题，需要在 nginx 配置中添加 try_files 指令，以确保刷新页面时正确处理请求。修改后的 nginx 配置如下：

location / { root E:/www/doctorLink/public; index index.html; # 解决 404 try_files $uri $uri/ /index.html;}

在这个配置中，try_files 指令的作用是：

尝试寻找 $uri 指定的文件。如果文件不存在，则尝试寻找 $uri/ 指定的目录。如果目录也不存在，则尝试寻找 /index.html 文件。

通过这种方式，nginx 可以正确处理刷新页面的请求，并确保始终加载 index.html 文件，从而避免 404 错误。

以上就是ThinkPHP5和Vue项目刷新页面出现404错误如何解决？的详细内容，更多请关注范的资源库其它相关文章！