聊聊springboot靜態資源加載的規則

我們經常會使用springboot創建web應用,在springboot中金靜態資源是如何存放的呢?

靜態資源映射規則

我們先創建一個springboot項目。使用https://start.spring.io/idea內置創建一個項目,不多說瞭。

我們要引入我們前端資源,我們項目中有許多的靜態資源,比如css,js等文件,我們以前寫

項目與都是自己建立文件夾,自己設計訪問路徑,但是現在,這個SpringBoot怎麼處理呢?

如果我們是一個web應用,我們的main下會有一個webapp,我們以前都是將所有的頁面導在

這裡面的,對吧!但是我們現在的pom呢,打包方式是為jar的方式,那麼這種方式

SpringBoot能不能來給我們寫頁面呢?當然是可以的,但是SpringBoot對於靜態資源放置的位置,是有所差別的,有自己的一套規則!

SpringBoot中,SpringMVC的web配置都在 WebMvcAutoConfiguration 這個配置類裡面;我們可以去看看 WebMvcAutoConfigurationAdapter 中有很多配置方法;有一個方法:addResourceHandlers 添加資源處理

public void addResourceHandlers(ResourceHandlerRegistry registry) {
   //默認配置沒有找到靜態資源
	if (!this.resourceProperties.isAddMappings()) {
    // 已禁用默認資源處理
       logger.debug("Default resource handling disabled");
   } else {
       Duration cachePeriod = this.resourceProperties.getCache().getPeriod();
       CacheControl cacheControl = this.resourceProperties.getCache().getCachecontrol().toHttpCacheControl();
       //webjars  maven 引入靜態資源
       if (!registry.hasMappingForPattern("/webjars/**")) {
           this.customizeResourceHandlerRegistration(registry.addResourceHandler(new String[]{"/webjars/**"}).addResourceLocations(new String[]{"classpath:/META-INF/resources/webjars/"}).setCachePeriod(this.getSeconds(cachePeriod)).setCacheControl(cacheControl));
       }
       String staticPathPattern = this.mvcProperties.getStaticPathPattern();
       if (!registry.hasMappingForPattern(staticPathPattern)) {
           this.customizeResourceHandlerRegistration(registry.addResourceHandler(new String[]{staticPathPattern}).addResourceLocations(WebMvcAutoConfiguration.getResourceLocations(this.resourceProperties.getStaticLocations())).setCachePeriod(this.getSeconds(cachePeriod)).setCacheControl(cacheControl));
       }
   }
}

1.webjars

Webjars本質就是以jar包的方式引入我們的靜態資源 , 我們以前要導入一個靜態資源文件,直接導入即可。

使用SpringBoot需要使用Webjars,我們可以去搜索一下:

網站:https://www.webjars.org

要使用jQuery,我們隻要要引入jQuery對應版本的pom依賴即可!

我們打開網站可以看到下面有很多前端js組件的maven引入。

在這裡插入圖片描述

<!--webjar 引入jquery-->
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>3.4.1</version>
</dependency>

將這段引入放進pom.xml文件,既可以在mavenjar包裡面看到jquery引入。

在這裡插入圖片描述

啟動項目訪問:http://localhost:8080/webjars/jquery/3.4.1/jquery.js即可看到jquery.js

在這裡插入圖片描述

2.springboot內置默認訪問路徑

在WebMvcAutoConfiguration mvc核心類組件裡面,我們看下面一行代碼,我們去找staticPathPattern發現第二種映射規則 :/** , 訪問當前的項目任意資源,它會去找 resourceProperties 這個類,我們可以點進去看一下分析:

String staticPathPattern = this.mvcProperties.getStaticPathPattern();
if (!registry.hasMappingForPattern(staticPathPattern)) {
	this.customizeResourceHandlerRegistration(registry.addResourceHandler(new String[]{staticPathPattern}).addResourceLocations(WebMvcAutoConfiguration.getResourceLocations(this.resourceProperties.getStaticLocations())).setCachePeriod(this.getSeconds(cachePeriod)).setCacheControl(cacheControl));
}

ResourceProperties 可以設置和我們靜態資源有關的參數;這裡面指向瞭它會去尋找資源的文件夾,即上面數組的內容。

所以:以下四個目錄存放的靜態資源可以被我們識別:

1.“classpath:/META-INF/resources/”,

2.“classpath:/resources/”,

3.“classpath:/static/”,

4. “classpath:/public/”

private static final String[] CLASSPATH_RESOURCE_LOCATIONS = new String[]{
"classpath:/META-INF/resources/",
 "classpath:/resources/",
 "classpath:/static/", 
 "classpath:/public/"};
    private String[] staticLocations;
    private boolean addMappings;
    private final ResourceProperties.Chain chain;
    private final ResourceProperties.Cache cache;
    public ResourceProperties() {
        this.staticLocations = CLASSPATH_RESOURCE_LOCATIONS;
        this.addMappings = true;
        this.chain = new ResourceProperties.Chain();
        this.cache = new ResourceProperties.Cache();
    }
    public String[] getStaticLocations() {
        return this.staticLocations;
    }

我們可以在resources根目錄下新建對應的文件夾,都可以存放我們的靜態文件;

比如我們訪問 http://localhost:8080/test.js , 他就會去這些文件夾中尋找對應的靜態資源文件;

在這裡插入圖片描述

分別在四個目錄下面建立一個test.js文件,我們分別測試一下。

在這裡插入圖片描述

四個目錄都有test.js,我們發現優先加載resourse下面的文件。

刪除resourse下面的test.js,再次查看一下,發現加載的是static下面的文件。

在這裡插入圖片描述

同樣,刪除static下面的文件在試一下:執行瞭public

在這裡插入圖片描述

最後刪除public下面的文件:

在這裡插入圖片描述

我們可以發現,springboot加載靜態資源文件的優先級:resourse>static>public>META-INF

我們也可以自己通過配置文件來指定一下,哪些文件夾是需要我們放靜態資源文件的,在application.properties中配置;

spring.resources.static-locations=classpath:/coding/,classpath:/cpown/

一旦自己定義瞭靜態文件夾的路徑,原來的自動配置就都會失效瞭!

3.首頁處理

@Bean
public WelcomePageHandlerMapping welcomePageHandlerMapping(ApplicationContext applicationContext, FormattingConversionService mvcConversionService, ResourceUrlProvider mvcResourceUrlProvider) {
     WelcomePageHandlerMapping welcomePageHandlerMapping = new WelcomePageHandlerMapping(new TemplateAvailabilityProviders(applicationContext), applicationContext, this.getWelcomePage(), this.mvcProperties.getStaticPathPattern());
     welcomePageHandlerMapping.setInterceptors(this.getInterceptors(mvcConversionService, mvcResourceUrlProvider));
     welcomePageHandlerMapping.setCorsConfigurations(this.getCorsConfigurations());
     return welcomePageHandlerMapping;
 }
 private Optional<Resource> getWelcomePage() {
     String[] locations = WebMvcAutoConfiguration.getResourceLocations(this.resourceProperties.getStaticLocations());
     return Arrays.stream(locations).map(this::getIndexHtml).filter(this::isReadable).findFirst();
 }
 private Resource getIndexHtml(String location) {
     return this.resourceLoader.getResource(location + "index.html");
 }

這是加載默認歡迎頁,靜態資源文件夾下的所有 index.html 頁面;被 /** 映射。

比如我訪問 http://localhost:8080/ ,就會找靜態資源文件夾下的 index.html

新建一個 index.html ,在我們上面的3個目錄中任意一個;然後訪問測試 http://localhost:8080/ 看結果!

在這裡插入圖片描述

在這裡插入圖片描述

4.網站圖標

與其他靜態資源一樣,Spring Boot在配置的靜態內容位置中查找 favicon.ico。如果存在這樣的文件,它將自動用作應用程序的favicon。

1、關閉SpringBoot默認圖標

#關閉默認圖標
spring.mvc.favicon.enabled=false

2、自己放一個圖標在靜態資源目錄下,我放在 public 目錄下

3、清除瀏覽器緩存!刷新網頁,發現圖標已經變成自己的瞭!

在這裡插入圖片描述

在這裡插入圖片描述

以上為個人經驗,希望能給大傢一個參考,也希望大傢多多支持WalkonNet。

推薦閱讀: