步骤如下:
1、在前端项目的 public 目录(或打包后的根目录)中,创建 WEB-INF 文件夹
(若打包后的前端文件放在 Tomcat 的 webapps/ROOT 下,则直接在 ROOT 目录下创建 WEB-INF)
2、在 WEB-INF 中创建 web.xml 文件,添加如下配置:
d
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1">
<!-- 配置欢迎页为 index.html -->
<welcome-file-list>
<welcome-file>index.html</welcome-file>
</welcome-file-list>
<!-- 配置错误页重定向:将 404 请求转发到 index.html -->
<error-page>
<error-code>404</error-code>
<location>/index.html</location>
</error-page>
</web-app>
3、重新打包前端项目,将打包后的文件(包含 WEB-INF 文件夹)部署到 Tomcat 的 webapps/ROOT 目录(或自定义上下文路径)。
4、重启 Tomcat,刷新页面即可正常访问。
补充说明:
若前端项目部署在 Tomcat 的非根路径(如 webapps/ruoyi-ui),需确保 web.xml 中的 路径与实际上下文匹配(例如 /ruoyi-ui/index.html)。
若使用 Nginx 作为反向代理,也可在 Nginx 中配置类似的路由重定向(比 Tomcat 配置更常用),示例:
location / {
root /path/to/ruoyi-ui; # 前端打包目录
index index.html;
try_files uri uri/ /index.html; # 核心:重定向到 index.html
}
通过以上配置,Tomcat 会将所有前端路由的刷新请求指向 index.html,由前端框架解析路由,避免 404 错误。