Fork me on GitHub

Http协议浏览器缓存缓存机制


山家除夕无他事,插了梅花便过年

http缓存一直有在用,也听前辈讲过,今天打算自己总结一下,把不同情况都试了一遍,发现网上有些内容并不全对。

首先,我们知道,浏览器缓存后,在浏览器的network中看到的状态码分两种情况,304和200 OK from cache

304

304是协商缓存,表示请求了服务器,但是内容没有变化,从浏览器本地缓存取数据

304 是通过按浏览器上的刷新按钮或者按F5刷新得到的状态码

从下图可以看到,headers中有etag属性,etag是资源的唯一标识,如果内容变了,etag会改变

Last-Modified 也是用于协商缓存的Last-Modified的值表示内容最后修改时间

浏览器请求已经缓存的资源时,会把etag和Last-Modified发送给服务器,服务器对比,如果浏览器发送来的和服务器的值相等,说明内容没有变化,服务器返回304给浏览器,浏览器从缓存读取数据

200 OK from cache

200 OK from cache 表示浏览器没有发出网络请求,直接取的本地缓存

200 OK from cache 是通过在地址栏回车得到的状态码

如下图,没有etag属性。etag是服务器计算出来的唯一值,因为没有请求服务器,所以也不会有etag标识

expires、Cache-Control

expires 表示过期日期,是绝对值。适用于http1.0协议

Cache-Control 表示缓存的时间,是相对值,比如3600,表示3600秒后失效。适用于http1.1及以上

如有expires和Cache-Control 同时存在,Cache-Control优先级更高

Cache-Control: no-cache:这个很容易让人产生误解,使人误以为是响应不被缓存。实际上Cache-Control: no-cache是会被缓存的,只不过每次在向客户端(浏览器)提供响应数据时,缓存都要向服务器评估缓存响应的有效性。

Cache-Control: no-store:这个才是响应不被缓存的意思。

Pragma: no-cache:跟Cache-Control: no-cache相同,Pragma: no-cache兼容http 1.0 ,Cache-Control: no-cache是http 1.1提供的。

请我喝一个苹果味的美年达吧,谢谢!