How are the image cached in the browser?

Today I encounter a bug.The chrome browser has cached all the images .By chrome dev-tool can find that the images were loaded from the memory cache.As usual , we can forcedly refresh the page(usint ctrl+f5).but we can’t tell all our clients to do that.

1. First try

Get learning about the concerned knowledge about cache.including etag,last-modified,expire,cache-control,


cache-control and expire define when the static files become invalid. If there is cached-control header that has max-age,or s-maxage, the expire will be ignored.
* cache-control: no-cache.public, private,no-store,must-revalidate, max-age
* expire: GMT timestamp.

The etag is a hash value which come from the file size, file content , last-modify-time and so on,last-modified means the latest modification timestamp, and it is a fallback mechanism.etag is more accurate.
If the sever doesn’t send the cached-control, the browser can choose to cache or no-cache the content.
From strockoverflow

From the the HTTP caching spec (section 13.4): Unless specifically constrained by a cache-control (section 14.9) directive, a caching system MAY always store a successful response (see section 13.8) as a cache entry, MAY return it without validation if it is fresh, and MAY return it after successful validation. This means that a user agent is free to do whatever it wants if no cache control header is sent. Most browsers use a combination of user settings and heuristics to determine whether (and how long) to cache in this situation.

In the chrome regarding this case,Chrome often cache the content, so we can find the http status code ‘200 cached from memory’

so adding the cache-control : no-cache in the nginx configuration.but it doesn’t work, the client told me that the page is still as same as before.debug it , find that her browser has cached the static files, even though I have add the cache-control,but before the static files expire ,the browser will not request the new resource.

2. change the static file path

The only way to resolve this problem is change the static content path,so I changed the path,It works!


版权声明:本文为zd10101501原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。