Spring boot WAR 部署到 Tomcat 并且缺少静态资源的上下文

Question

在将 Spring Boot 应用程序作为 WAR 文件部署到独立的 Tomcat 7 服务器时遇到问题。它可以正常构建和部署，但是当 index.html 页面尝试加载其他静态资源时，它们会丢失 url 中的上下文，因此无法加载 (404)。

例如http://localhost:8080/app/images/springboot.png

应该是：http://localhost:8080/spring-boot-war-context-issue/app/images/springboot.png

Image showing issue

使用嵌入式Tomcat时效果很好

类似问题：

似乎与以下问题类似： Spring-Boot war external Tomcat context path

但是，该问题中的建议似乎并未解决我的问题。我不确定 Tomcat xml 文件。

后续步骤：

我创建了一个简单的示例应用程序并按照 Spring Boot 文档中的步骤进行操作。

可以在此 github 存储库中查看示例代码以及重现问题的步骤：https://github.com/jgraham0325/spring-boot-war-context-issue

到目前为止我尝试过的事情：

• 在 application.properties 中设置 contextPath，但这仅适用于嵌入式 tomcat
• 尝试使用全新安装的 Tomcat 7
• 尝试在 tomcat 中创建配置文件以强制上下文： apache-tomcat-7.0.72\conf\Catalina\localhost\spring-boot-war-context-issue.xml

spring-boot-war-context-issue.xml的内容：

    <Context 
    docBase="spring-boot-war-context-issue" 
    path="spring-boot-war-context-issue" 
    reloadable="true" 
    />

任何建议将不胜感激！

谢谢

2016 年 10 月 23 日更新：

Alex 关于在开头使用不带斜线的相对 URL 的回答是完美的解决方案！

Answer 1

如果使用Thymeleaf，另一种方法是使用Context-Relative URLs，如下所示：

<link rel="icon" type="image" th:href="@{/img/favicon.ico}"/>

更多信息请参考：Thymeleaf Documentation

Answer 2

不就是你在index.html中定义你的url的方式造成的吗（url不包括context root）：

<img src="/app/images/springboot.png" />

使用相对 uri

您应该能够使用相对 uri（没有前导正斜杠）：

<img src="app/images/springboot.png" />

获取上下文根

• How do you get the contextPath from JavaScript, the right way?

• How to set ContextPath for an image link

• Browser can't access/find relative resources like CSS, images and links when calling a Servlet which forwards to a JSP

• How to use relative paths without including the context root name?

使用 JSP/JSTL：

<img src="${pageContext.request.contextPath}/app/images/springboot.png" />

或使用 Javascript：

function getContextPath() {
   return window.location.pathname.substring(0,  window.location.pathname.indexOf("/",2));
}
...
var img = new Image();
img.src = getContextPath() + "/app/images/springboot.png";
document.getElementById('div').appendChild(img);