Spring boot webjars: unable to load javascript lib

2019-03-19 19:55发布

I have a spring boot (I use Thymeleaf for templating) project where I want to use some jQuery libraries.

Unfortunately, the webjars aren't loading at all. I have tried many configuration but all of them failed.

Here is the code snippet of my HTML page:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">

<title>JAC</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

<script src="http://cdn.jsdelivr.net/webjars/jquery/2.1.4/jquery.js"
        th:src="@{/webjars/jquery/2.1.4/jquery.min.js}" type="text/javascript"></script>
<script src="http://cdn.jsdelivr.net/webjars/jquery-file-upload/9.10.1/jquery.fileupload.js"  type="text/javascript"
        th:src="@{/webjars/jquery-file-upload/9.10.1/jquery.fileupload.min.js}"></script>
<link href="http://cdn.jsdelivr.net/webjars/bootstrap/3.3.5/css/bootstrap.min.css"
      th:href="@{/webjars/bootstrap/3.3.5/css/bootstrap.min.css}"
      rel="stylesheet" media="screen" />
<link href="http://cdn.jsdelivr.net/webjars/jquery-file-upload/9.10.1/jquery.fileupload.css"
      rel="stylesheet" media="screen" />
</head>

I have added them in the pom file:

<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>jquery</artifactId>
    <version>2.1.4</version>
</dependency>
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>3.3.5</version>
</dependency>

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery-file-upload</artifactId>
    <version>9.10.1</version>
</dependency>

But when calling the page I got a 404 on jquery.min.js and jquery.fileupload.min.js.

GET http://localhost:8888/webjars/jquery-file-upload/9.10.1/jquery.fileupload.min.js 
2015-09-21 02:02:04.059 home:9 
GET http://localhost:8888/webjars/jquery/2.1.4/jquery.min.js 404 (Not Found)

6条回答
戒情不戒烟
2楼-- · 2019-03-19 20:11

You are referencing jquery library correctly. Maybe you are missing resource handler configuration.

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

Or if you use JavaConfig

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

  @Override
  public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
  }

}

Webjars documentation

If this will not work, please check if you have webjars on classpath (open your application JAR in 7Zip and check if webjars resources are inside it.)

查看更多
【Aperson】
3楼-- · 2019-03-19 20:12

Additional answer found on one blog:

When using Spring Framework version 4.2 or higher, it will automatically detect the webjars-locator library on the classpath and use it to automatically resolve the version of any WebJars assets.

In order to enable this feature, we’ll add the webjars-locator library as a dependency of the application:

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>webjars-locator</artifactId>
    <version>0.30</version>
</dependency>

In this case, we can reference the WebJars assets without using the version; (...)

查看更多
ゆ 、 Hurt°
4楼-- · 2019-03-19 20:15

After inspecting the webjar for jquery, I got this working by adding a "dist" subpath.

<script src="webjars/jquery/2.1.4/dist/jquery.min.js" type="text/javascript"></script>
查看更多
爷的心禁止访问
5楼-- · 2019-03-19 20:20

The webjars dependencies should be available on the spring boot classpath, so you should try referencing the webjars using the src attribute like so:

<script src="webjars/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
<script src="webjars/jquery-file-upload/9.10.1/jquery.fileupload.min.js"></script>
<link href="webjars/bootstrap/3.3.5/css/bootstrap.min.css"
  rel="stylesheet" media="screen" />
<link href="webjars/jquery-file-upload/9.10.1/jquery.fileupload.css"
  rel="stylesheet" media="screen" />
查看更多
女痞
6楼-- · 2019-03-19 20:26

if you use servlet 3.x just add :

1- using java config :

@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {

    public void addResourceHandlers(ResourceHandlerRegistry registry) {

            registry.addResourceHandler("/webjars/**").addResourceLocations("/webjars/").resourceChain(false);

       registry.setOrder(1);
    }


}

2- or xml config :

<mvc:resources mapping="/webjars/**" location="/webjars/"> 
  <mvc:resource-chain resource-cache="false" /> 
</mvc:resources>
查看更多
啃猪蹄的小仙女
7楼-- · 2019-03-19 20:27

I ended up doing a mvn clean install (from cmd prompt) to get the target cleaned and all the lib/jars populated correctly. I am using Spring boot with Intelij.

查看更多
登录 后发表回答