缓存策略之浏览器

缓存策略之浏览器

如果一份资源（ html、js、css ），同时存放在本地缓存、缓存服务器和源服务器
本文主要探究浏览器如何获取资源，欢迎关注 Git博客仓库

缓存控制

用来确定请求和响应是否被缓存

Cache-Control	描述
public	可以被任何对象缓存
private	只能被单个用户缓存，代理服务器不能缓存
no-cache	缓存资源，并立即过期
no-store	不缓存响应和请求
max-age	设置缓存的最大存储时间

Pragma：no-cache	缓存资源，向服务器验证（http1.0）

响应头中 no-cache 和 max-age=0 和请求头中 max-age=0，表现一致，需要向服务器验证，成功返回304，失败返回200，重新下载资源
请求头中 no-cache，则是向服务器请求资源，返回 200。详细机制看 Disambiguating Multiple Responses

过期机制

字段	描述
Expires	设置资源过期的绝对时间，对比本地时间，即请求头 Date
max-age	相对于请求时间，有效级高于 Expires
Last-Modified	资源最后修改时间

当缓存过期前，从本地缓存获取资源，其次向缓存服务器获取，过期后会向服务器验证

当 max-age 和 Expires 均没有设置，则会采用启发式过期时间 （Date - Last-Modified）* 10%

缓存验证

字段	描述
ETag	文档唯一标示，用字符串标示
if-None-Match	验证ETag是否相同，优先级高于if-Modified-since
if-Modified-Since	验证资源在指定时间后是否修改

验证通过后，当本地没有缓存，源服务器返回 304 到缓存服务器，缓存服务器返回 200 到浏览器
因为，max-age 是相对于请求时间，所以缓存的的过期时间相应延长

Vary响应

Vary	请求头字段

设置指定字段，缓存服务器会对比上一次请求中的字段，相同返回资源
Vary: User-Agent 可以区分浏览器版本
初次请求，缓存服务器为空，直接向源服务器请求，在缓存服务器以指定UA存储
再次请求，UA 不同，缓存服务器向源服务器请求，再次指定UA存储
发出请求，UA 相同，缓存服务器直接返回资源

相关链接

• 《基于缓存策略三要素分解法》
• 《 MDN HTTP 缓存》