公司前端写的后台部署到tomcat
webapps目录下后,无法进行刷新,一刷新就会报错404,自动跳的404页面。在网上查了下,官方说是HTML5 History
模式引发的问题,但是解决方案中,并没有tomcat的解决方案。如链接:https://router.vuejs.org/zh-cn/essentials/history-mode.html

废话不多说直接进入主题

  • 我使用的是Vue4.X
    当运行命令npm run build 后 会产生一下如图所示的文件
    在这里插入图片描述
    在这里插入图片描述
    然后直接将图片一中的dist 文件夹进行压缩打包上传到服务器中的webapps 目录下 如右图所示
    在这里插入图片描述
    此时项目已经部署完成可以通过浏览器进行访问了,但是你会发现子路由以刷新就会包404的错误
    **

解决方案来了

dist 文件夹中创建一个 WEB-INF的文件夹 并在该文件夹中创建一个web.xml 如图所示:
在这里插入图片描述

web.xml 内容

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns="http://xmlns.jcp.org/xml/ns/javaee"
 xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee/web-app_2_5.xsd"
 id="scplatform" version="2.5">
 <display-name>/</display-name><!--/webName/-->
 <error-page>
 <error-code>404</error-code>
 <location>/index.html</location>
 </error-page>
</web-app>

OK 这样就完美的解决了刷新404的问题了

如有不懂欢迎私信

Logo

前往低代码交流专区

更多推荐