Spring MVC with Thymeleaf + Bootstrap with webjars

Question

我有一个Spring项目，其中我在pom.xml中包含了以下webjars

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>3.3.7-1</version>
</dependency>
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>3.1.1</version>
</dependency>

然后，我在HTML视图中包含了以下链接和脚本：

<link rel="stylesheet" href="@{/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css}" />

<script src="@{/webjars/jquery/3.1.1/jquery.min.js}"></script>
<script src="@{/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js}"></script>

但它不起作用，没有找到映射：

[org.springframework.web.servlet.PageNotFound] (default task-15) No mapping found for HTTP request with URI [/TestPublicWeb-0.0.1-SNAPSHOT/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css] in DispatcherServlet with name 'testapp'

...so我尝试在servlet.xml中包含以下映射

<mvc:resources mapping="/webjars/**" location="classpath:/META-INF/resources/webjars/"/>

但是这样，我的/TestApplication的映射就找不到了：

[org.springframework.web.servlet.PageNotFound] (default task-13) No mapping found for HTTP request with URI [/TestApplication/] in DispatcherServlet with name 'testapp'

应该如何正确地将webjar包含在Spring项目中？

Answer 1

问题是你把标准的HTML href标签和Thymeleaf的语法@{}混在一起了。按如下方式进行更改：

<link rel="stylesheet" th:href="@{/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css}" />

<script th:src="@{/webjars/jquery/3.1.1/jquery.min.js}"></script>
<script th:src="@{/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js}"></script>

如果你正在使用Spring Security，你还需要在configure(HttpSecurity http)方法中指定对你的webjar的授权，如下所示：

http.authorizeRequests().antMatchers("/webjars/**").permitAll();

Answer 2

我可以想到几件事来解释为什么上面的方法对你不起作用。确保在servlet.xml文件中使用spring mvc名称空间。看起来像这样：

<bean xmlns:mvc="http://www.springframework.org/schema/mvc"....

当您已经指定类路径时，也不确定为什么要尝试使用@{..}访问资产。尝试按如下方式删除@{..}：

<link rel="stylesheet" href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" />

<script src="/webjars/jquery/3.1.1/jquery.min.js"></script>
<script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script>