Tomcat:部署前后端分离项目踩坑

很久没有使用Tomcat部署前后端分离项目了,这两天遇到小伙伴有这方面的需求,就做了尝试,踩坑记录如下。

坑点1:SpringBoot打包本地jar包依赖未被包含

SpringBoot如果在开发阶段应用了本地jar包,在打成jar包时,通常是需要在pom.xml文件中添加如下配置,可以确保在打包阶段本地jar包被正常引入和构建。

但是,将SpringBoot打包成war包时,以上配置就会失效了。将其放入tomcat中启动时,会报错:找不到本地依赖的jar包。其实,该jar包已经被构建过了,只是没有被放到正确的路径下。

在tocmat的webapps中,查看服务路径WEB_INFO下,有两个子路径:lib和lib-provided,而提示找不到的jar包就是被放到了lib-provided子路径下,只需要将其拷贝到lib子路径下,即可保证war包部署到tomcat中之后,可以正常启动。

坑点2:Vue3前端项目部署路径问题

前端项目使用history路由模式,页面部署之后,只能通过localhost:8080/xxx进行访问,无法通过localhost:8080/路径名/xxx-router访问。

可以修改vite.config.ts中的base配置项进行解决,

坑点3:Vue3前端项目部署之后,刷新页面404

解决方案:在前端所在目录下新建:WEB-INF/web.xml文件,写入内容,

XML 复制代码
<?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.0" metadata-complete="true">
<display-name>Router for Tomcat</display-name>
  <error-page>
  <error-code>404</error-code>
  <location>/index.html</location>
  </error-page>
</web-app>
相关推荐
一大树几秒前
Vue3祖孙组件通信方法总结
前端·vue.js
不要进入那温驯的良夜1 分钟前
跨平台UI自动化-Appium
前端
海底火旺2 分钟前
以一个简单的React应用理解数据绑定的重要性
前端·css·react.js
不要进入那温驯的良夜2 分钟前
浏览器技术原理
前端
在泡泡里2 分钟前
前端 mcp 的使用
前端
爱学习的茄子4 分钟前
React Hooks驱动的Todo应用:现代函数式组件开发实践与组件化架构深度解析
前端·react.js·面试
宇宙全栈Link4 分钟前
当 React 组件调用自定义 hooks,hooks 又调用其他 hooks 时,状态变化如何传播?
前端·javascript·react.js
南方kenny5 分钟前
从0到1理解JS事件委托:让你的代码性能提升一个level
前端·javascript
西瓜树枝6 分钟前
用 iframe 实现前端批量下载的优雅方案 —— 从原理到实战
前端·javascript
coder_zhx6 分钟前
Vue3自定义编程式弹窗
前端·vue.js