spring boot web 静态资源缓存配置
静态资源缓存
采用Spring Boot开发Web项目时,静态文件(css、js)每次都会从服务器加载。Spring boot可设置静态文件缓存,设置方式可通过配置文件或者配置类实现。
参考
https://docs.spring.io/spring-boot/docs/2.0.0.M2/reference/htmlsingle/ SPRING RESOURCES HANDLING
1. 通过配置文件配置
#配置静态资源映射
spring.mvc.static-path-pattern=/static/**
spring.resources.static-locations=classpath:/static
# 资源缓存时间,单位秒,30天
spring.resources.cache-period=2592000
# 开启gzip压缩
spring.resources.chain.gzipped=true
# 启用缓存
spring.resources.chain.cache=true
# Enable the Spring Resource Handling chain. Disabled by default
spring.resources.chain.enabled=true
# 开启版本控制策略,默认为false
spring.resources.chain.strategy.content.enabled=true
# 指定要应用的版本的路径,多个以逗号分隔,默认为:[/**]
spring.resources.chain.strategy.content.paths=/**
# 设定Session的追踪模式(cookie, url, ssl)
server.session.tracking-modes=cookie
2. 通过配置类配置
@Configuration
//@EnableWebMvc
public class WebMvcConfig implements WebMvcConfigurer {
@Autowired
private StringHashCacheData stringCacheService;
/**
* 配置静态资源
* 此处可使用 properties 文件配置
* @param registry
*/
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
VersionResourceResolver versionResourceResolver = new VersionResourceResolver()
.addVersionStrategy(new ContentVersionStrategy(), "/**");
registry.addResourceHandler("static/**")
.addResourceLocations("classpath:/static/")
.setCachePeriod(2592000).resourceChain(true)
.addResolver(versionResourceResolver);
}
}
配置完成之后,静态文件都可以缓存到浏览器本地。同时也存在一个问题,如果服务器静态文件修改,浏览器端在未过期之前是不会重新加载文件的。此时需要通过版本号来控制。spring boot版本号支持两种,一种是文件md5,另一种是固定版本号。如下只描述md5方式,spring boot启动时会计算每个静态文件的md5值并缓存,浏览器访问时每个静态文件后缀前加上md5值作为版本号,如果服务器md5值改变则浏览器重新加载。(需要重启应用才会重新生成md5)
1. 通过ResourceUrlProvider
@ControllerAdvice
public class ResourceUrlProviderController {
@Autowired
private ResourceUrlProvider resourceUrlProvider;
@ModelAttribute("urls")
public ResourceUrlProvider urls() {
return this.resourceUrlProvider;
}
}
修改html文件引用,文件路径通过urls.getForLookupPath()来获取
<link th:href="@{${urls.getForLookupPath('/js/element-ui/unpkg.index.css')}}" rel="stylesheet"/>
<link th:href="@{${urls.getForLookupPath('/css/element-common.css')}}" rel="stylesheet"/>
<link th:href="@{${urls.getForLookupPath('/css/element-main.css')}}" rel="stylesheet"/>
2. 模板引擎中可直接使用 ResourceUrlEncodingFilter
如果使用JSPs, Thymeleaf, FreeMarker and Velocity模板引擎,可直接使用此方法增加静态文件md5。不用修改html文件。WebMvcConfig中增加如下bean即可。
/**
* JSPs, Thymeleaf, FreeMarker and Velocity模板引擎,可直接使用此方法增加静态文件md5
*/
@Bean
public ResourceUrlEncodingFilter resourceUrlEncodingFilter() {
return new ResourceUrlEncodingFilter();
}
通过以上两种方式,查看源文件如下:
<link href="/static/js/element-ui/unpkg.index-fa5a34770cfc018906ba56631cde8384.css" rel="stylesheet"/>
<link href="/static/css/element-common-8d034911c02f85a64a6347a36306fe69.css" rel="stylesheet"/>
<!-- 引入组件库 -->
<script src="/static/js/element-ui/vue.min-c56f84b7ae1b95b070add89efc71279e.js"></script>
<script src="/static/js/element-ui/unpkg.index-48aa15a6dba29cfbedf7423e315981f7.js"></script>
<script src="/static/js/jquery/jquery-1.11.3.min-13c0a5055cca7b2463b2f73701960b9e.js"></script>
<script src="/static/js/bootstrap.min-b2f171a91ddaf1c5bac9213eb362fc0a.js"></script>
<script src="/static/js/sha1-f8b7a25b8a763a501be5de14134c1cd1.js"></script>
<script src="/static/js/placeholder-52fdc121ee331aee7e590794a665deb8.js"></script>
<script src="/static/js/md5-b63ff39aa1ee38d5fa50fde1167f1175.js"></script>
<script src="/static/js/jquery.validate.min-37393e7134311accfe3a8ca6e7e96038.js"></script>
<script src="/static/js/bootstrap.ext-b24cd1401c3771228503d0dea0db6385.js"></script>
<script src="/static/js/jcf/jcf-5c852dec956dac0d976584ec86a4051a.js"></script>
<script src="/static/js/jcf/jcf.scrollable-8eb535ed592e36b23dc0dd789744252e.js"></script>
<script src="/static/js/pop-65f1965e2601c20440157a1f13a90bad.js"></script>
<script src="/static/js/views/common-b3c967314abe758b20f09d9548a61ec1.js"></script>
<script src="/static/js/views/cookie-51e9e652134e71ae055de54442749fb7.js"></script>