SpringBoot简明教程之视图层（一）：静态资源映射规则及WebJars的使用

文章目录

SpringBoot简明教程之视图层（一）：静态资源映射规则及WebJars的使用

项目建立
静态资源映射规则

静态资源映射优先级
Favicon图标的修改
修改默认的静态文件夹

WebJars

WebJars简介
WebJars示例

总结
源码地址
联系做者

项目建立

SpringBoot项目的建立过程已经在：SpringBoot简明教程之快速建立第一个SpringBoot应用中进行了详细的介绍，这里就再也不进行赘述。css

静态资源映射规则

咱们在org/springframework/boot/autoconfigure/web/ResourceProperties.class中看到了以下的代码：html

private static final String[] CLASSPATH_RESOURCE_LOCATIONS = new String[]{"classpath:/META-INF/resources/", "classpath:/resources/", "classpath:/static/", "classpath:/public/"};

也就意味在SpringBoot在查找任何资源时，都会在一下文件夹中去找到相应的映射文件：java

"classpath:/META-INF/resources/",
"classpath:/resources/", 
"classpath:/static/",
"classpath:/public/"

静态资源映射优先级

例如，咱们在static文件夹中建立index.htmljquery

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
Hi,欢迎关注公众号：Newtol
</body>
</html>

启动SpringBoot项目，并访问：http://localhost:8080/git

浏览器返回：github

Hi,欢迎关注公众号：Newtol

访问成功。web

在classpath目录（即为：SpringBoot下的resources目录）中建立resources文件夹，并建立以下的index.htmlspring

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
hello,欢迎关注公众号：Newtol
</body>
</html>

再次启动SpringBoot项目，并访问：http://localhost:8080/bootstrap

浏览器返回：浏览器

hello,欢迎关注公众号：Newtol

可见，咱们从新编写的index.html文件就覆盖了以前在static文件夹中的index.html。例外几种状况就再也不一一展现，咱们也能够得出结论，静态映射文件的优先级关系：

"classpath:/META-INF/resources/" >"classpath:/resources/"> "classpath:/static/"> "classpath:/public/"

咱们以前使用的都是默认的欢迎页(index.html)，因此咱们无需在访问的时候指定具体的资源名字也能够正确的映射到，是由于若是咱们指定具体的资源信息，SpringBoot会自动到每一个文件夹中寻找命名为index.html的资源。

例如：咱们在classpath:/resources/resources下建立test文件夹，并建立test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    hi,这是test！欢迎关注公众号：Newtol
</body>
</html>

启动项目，若是咱们输入：http://localhost:8080/test

就会发现浏览器报错：

Whitelabel Error Page
This application has no explicit mapping for /error, so you are seeing this as a fallback.

Thu Oct 25 19:11:45 CST 2018
There was an unexpected error (type=Not Found, status=404).
No message available

这是由于，当咱们输入http://localhost:8080/test时，SpringBoot没法在test目录下找到默认的资源，就会报404。这时咱们就须要访问：http://localhost:8080/test/test.html才能正确的获取资源信息了，浏览器返回：

hi,这是test！欢迎关注公众号：Newtol

Favicon图标的修改

正常状况下，当咱们访问网页时，咱们发现SpringBoot页面的图标为：

若是咱们想要更改前面的小图标，咱们应该怎么作呢？其实很简单，咱们只须要将咱们的图标命名为favicon.ico而且放在咱们默认的静态文件夹下，例如：

启动项目，而后再次访问http://localhost:8080/test/test.html

发现图标已经更改为功：

修改默认的静态文件夹

若是咱们想自定义SpringBoot的静态文件夹的地址，咱们应该如何进行配置呢？

咱们在application.yml中进行以下配置：

spring:
  resources:
    static-locations: classpath:/resources/test/

咱们就将默认的文件夹指向了resources中下的test文件夹，咱们再访问：http://localhost:8080/，就会发现报错404：

Whitelabel Error Page
This application has no explicit mapping for /error, so you are seeing this as a fallback.

Thu Oct 25 19:42:17 CST 2018
There was an unexpected error (type=Not Found, status=404).
No message available

咱们在test文件夹中建立index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    hello,这里是新的静态资源文件夹！
</body>
</html>

启动项目，访问：http://localhost:8080/

浏览器返回：

hello，这里是新的静态资源文件夹！

默认的静态文件夹修改为功！

WebJars

WebJars简介

Webjars的官网是这样介绍它的：

WebJars are client-side web libraries (e.g. jQuery & Bootstrap) packaged into JAR (Java Archive) files.

大体的意思是，WebJars是将咱们在视图层所中须要的大多数例如jQuery和Bootstrap等资源打成的Jar包，以对资源进行统一依赖管理，WebJars的jar包部署在Maven中央仓库上。

WebJars示例

接下来，咱们将演示如何导入Bootstrap资源到项目中。

首先，咱们先到WebJars的官网，找到咱们想要使用的资源版本：

而后咱们将对应的配置加入到pom.xml配置文件中：

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

而后咱们就会发现：咱们导入的依赖的目录结构，跟咱们以前介绍的静态资源映射规则是一致的。

而后，咱们从新编写test文件夹下的index.html文件:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<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>
</head>
<body>
<div class="container"><br/>
<div class="alert alert-success">
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
<strong> Hello,欢迎关注公众号:Newtol!</strong>
</div>
</div>
</body>
</html>

访问：http://localhost:8080/

浏览器返回：

导入Bootstrap资源成功！对于其余资源的导入，基本都是大同小异的过程，这里就再也不展现。

总结

咱们介绍了有关SpringBoot中关于静态资源加载的一些规则，以及如何根据项目的实际须要去更改默认的静态文件夹，最后咱们介绍了Webjars的使用，webjars极大的方便了咱们对于一些web资源的管理。

源码地址

点我点我

联系做者

有关转载、错误指正、问题咨询等事宜请扫码关注我的公众号进行联系，更有大量视频学习资源分享

SpringBoot简明教程之Web视图层（一）：WebJars及静态资源映射规则