这篇文章的笔记:https://zhuanlan.zhihu.com/p/28113197
##浏览器缓存
1. 无需验证
针对缓存脚本始终不变,设置文件返回的http头中的cache-control为:
Cache-control: max-age=31536000
因为标准中规定max-age最大不能超过一年,所以设为最大值31536000(以秒为单位);
如果脚本内容必须更改,就改变请求的文件名;
2. 需要验证
设置cache-control为一个较小的时间(比如2分钟);
验证机制:
服务器第一次返回给浏览器的响应http头中,Etag字段表示这个请求的token,用于标识这个请求返回的唯一性;
资源过期之后浏览器再次请求时,添加一个If-None-Match的http头信息,就是过期资源的Etag值。服务器会比对Etag的版本信息来判断资源是否进行了更新;
如果验证之后发现资源发生了更改就返回完整的资源内容(状态码200);否则返回304 Not Modified(状态码304)告知浏览器文件内容并未发生修改;
If-None-Match
被称为Conditional Headers,这样的请求称为Conditional Request
###一些技术细节
Cache-Control的其他值
仍然对资源使用缓存,但是每一次在使用缓存之前必须向服务器对缓存 资源进行验证。
不使用任何缓存。
当缓存资源小于max-age时使用缓存,否则就需要对资源进行验证(所以must-revalidate和max-age组合使用最好)。
Expires和max-age
Expires指定的是过期的具体时间(推荐向max-age过渡);
Etag属于强验证(Strong Validation),期望的是资源字节级别的一致;
Last-Modified属于弱验证(Weak Validation),只要资源的主要内容一致即可;
约定:
max-age=0:资源过期,需要重新验证;
no-cache:在每一次使用缓存之前必须强制对资源进行重新验证;
no-cache情况下浏览器不会在服务器验证成功之前使用过期的缓存资源,max-age=0不一定。
需要将Cache-Control设为private,避免中间服务器缓存返回。
###其他tips
对于样式或者脚本这种常变化的资源,不要用max-age。
网络请求首先到达的是sw脚本中,如果未命中再转发给http缓存(这部分稍后记录)。
——> 类库sw-precache
###浏览器的整体缓存机制
一个请求在查找资源的过程中经过的缓存顺序是Memory Cache -> Service Worker -> HTTP Cache -> Push Cache。
包含当前文档中页面中已经抓取到的资源(页面上已经下载的样式,脚本、图片等);
这些资源都暂存在内存中,当用户结束浏览网页并且关闭网页时,内存缓存的资源会被释放掉;
最重要的缓存资源是preloader相关指令(比如)下载的资源。如果资源已经存在于缓存中,则可能不会再进行preload。
内存缓存在缓存资源时并不关心返回资源的HTTP缓存头Cache-Control是什么值,同时资源的匹配也并非仅仅是对URL做匹配,还可能会对Content-Type,CORS等其他特征做校验。
针对推送资源设定的,推送缓存的级别是session级别的,如果session结束则资源被释放;
存储时间较短,也并非严格执行http头中的缓存指令;