I'm trying to implement Etag features to my Spring Boot application, so browsers can update image cache when the server image is changed.
I changed Spring Boot setting via a YAML file:
spring:
jackson:
serialization:
WRITE_DATES_AS_TIMESTAMPS: false
resources:
static-locations: classpath:static/
chain:
strategy:
content:
enabled: true
cache:
cachecontrol:
max-age: 0
must-revalidate: true
no-cache: true
mvc:
static-path-pattern: /resources/**
and added a ShallowEtagHeaderFilter bean:
@Configuration
public class MvcConfig implements WebMvcConfigurer {
@Bean
public ShallowEtagHeaderFilter shallowEtagHeaderFilter() {
return new ShallowEtagHeaderFilter();
}
}
The first request & response header:
GET /resources/image/product/list/foo.png HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.131 Safari/537.36
DNT: 1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,ko-KR;q=0.8,ko;q=0.7,vi;q=0.6
Cookie: _ga=GA1.1.134751806.1551948465; loginFlag=undefined; branchId=admin
HTTP/1.1 200
Last-Modified: Wed, 08 May 2019 05:17:32 GMT
Cache-Control: no-cache, must-revalidate
Accept-Ranges: bytes
ETag: "0b99ccc3070d4e65cd155b768a56f97e4"
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
X-Frame-Options: DENY
Content-Type: image/png
Content-Length: 101070
Date: Fri, 10 May 2019 08:03:37 GMT
Second request & response header without changing the static file:
GET /resources/image/product/list/foo.png HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Cache-Control: max-age=0
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.131 Safari/537.36
DNT: 1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,ko-KR;q=0.8,ko;q=0.7,vi;q=0.6
Cookie: _ga=GA1.1.134751806.1551948465; loginFlag=undefined; branchId=admin
If-None-Match: "0b99ccc3070d4e65cd155b768a56f97e4"
If-Modified-Since: Wed, 08 May 2019 05:17:32 GMT
HTTP/1.1 304
Last-Modified: Wed, 08 May 2019 05:17:32 GMT
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
X-Frame-Options: DENY
Date: Fri, 10 May 2019 08:05:32 GMT
For the third, I stopped the localhost server, overwrote foo.png
with the other file, rebuilt the project and run server. I expected the request should return the changed image file, but the status was 304 with the same image as before:
GET /resources/image/product/list/foo.png HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Cache-Control: max-age=0
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.131 Safari/537.36
DNT: 1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,ko-KR;q=0.8,ko;q=0.7,vi;q=0.6
Cookie: _ga=GA1.1.134751806.1551948465; loginFlag=undefined; branchId=admin
If-None-Match: "0b99ccc3070d4e65cd155b768a56f97e4"
If-Modified-Since: Wed, 08 May 2019 05:17:32 GMT
HTTP/1.1 304
Last-Modified: Sun, 05 May 2019 19:08:52 GMT
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
X-Frame-Options: DENY
Date: Fri, 10 May 2019 08:09:32 GMT
I'm clueless how to refresh browser's cache when the file is changed. What am I missing?
It seems there was no problem with the settings. Instead of building and running the project via IDE(IntelliJ IDEA), I tried Gradle bootJar
and ran the jar file and it worked as intended.