Spring Boot项目部署到外部Tomcat时静态资源路径异常问题咨询

解决方案 #

方案1：使用模板引擎自动拼接上下文路径（最推荐）

如果项目使用Thymeleaf作为模板引擎，直接使用Thymeleaf提供的路径语法，模板会自动根据当前部署的上下文路径动态拼接前缀：

<link rel="stylesheet" th:href="@{/css/login.css}">

如果使用JSP，使用request内置对象获取上下文路径：

<link rel="stylesheet" href="${pageContext.request.contextPath}/css/login.css">

两种写法都不需要硬编码上下文路径，内嵌Tomcat、外部Tomcat部署自动适配。

方案2：统一部署上下文路径

如果希望本地开发和线上部署的路径完全一致，不需要修改任何前端资源代码：

1. 若使用外部Tomcat部署，将打包后的war包重命名为ROOT.war，放入Tomcat的webapps目录，启动后会自动作为根上下文部署，访问地址和内嵌Tomcat一致，为http://localhost:8080/home
2. 也可以在Spring Boot配置文件中添加配置，让内嵌Tomcat也使用和外部部署一致的上下文路径，application.properties写法：

server.servlet.context-path=/MyApp

yaml写法：

server:
  servlet:
    context-path: /MyApp

配置后本地启动访问地址同样为http://localhost:8080/MyApp/home，本地调试和线上部署路径完全对齐。

方案3：纯静态页面适配方案

如果项目使用纯静态HTML，没有后端模板引擎支持：

• 可以使用相对路径引用静态资源，去掉路径开头的根路径标识/：

<link rel="stylesheet" href="./css/login.css">

• 也可以通过公共JS动态获取上下文路径拼接资源地址：

// 公共JS中全局定义上下文路径
const contextPath = window.location.pathname.split('/')[1] === 'MyApp' ? '/MyApp' : ''
// 引用资源时拼接前缀
document.write(`<link rel="stylesheet" href="${contextPath}/css/login.css">`)

内容的提问来源于stack exchange，提问作者Azrahell