什么是缓存
HTTP缓存是一种机制,它允许浏览器在本地存储Web资源的副本,以便在下次访问相同资源时, 可以直接从本地获取而不是重新从服务器下载。这种机制可以节省网络流量并减少页面加载时间,因为浏览器不必每次都从服务器请求资源。 在这个过程中,HTTP缓存可以帮助减少网络流量和提高页面加载速度,从而提供更好的用户体验。

在Network面板中的size列表里,会看到两种标识:from memory cache 和 from disk cache 字样, 这就说明该资源来自缓存,memory cache 表示缓存来自内存,disk cache 表示缓存来自硬盘
HTTP缓存中有两种缓存方式:
- 强制缓存
- 协商缓存
强缓存
判断缓存是否过期,如果没过期,直接使用。如果过期了,就请求服务器,获取最新的资源
第一次访问页面,浏览器会根据Response Header来判断是否对资源进行缓存, 如果响应头中有 cache-control: max-age=2952000 或 expires 字段,代表该资源是强缓存

协商缓存
浏览器携带缓存标识向服务器发送请求,服务器根据缓存标识来决定该资源是否过期
协商缓存的条件:
- Cache-Control 的值为 no-cache (协商缓存)
- 或者 Cache-Control: max-age=0

Expires
是HTTP1.0控制网页缓存的字段,值为一个时间戳,服务器返回该资源缓存的到期时间, 但 Expires 有个缺点,就是它判断是否过期是用本地时间来判断的,本地时间是可以自己修改的,这样会导致缓存失效; 到了HTTP/1.1,Expire 已经被 Cache-Control 替代,Cache-Control 使用了max-age相对时间,解决了Expires 的缺陷
注意
当 Cache-Control 与 expires 两者都存在时,Cache-Control 优先级更高
Cache-Control
HTTP1.1 中控制网页缓存的字段
主要取值为:
- public:资源客户端和中间代理服务器都可以缓存
- private:资源只有客户端可以缓存,中间代理服务器不可以缓存
- no-cache:客户端缓存资源,但是是否缓存需要经过协商缓存来验证
- no-store:不使用缓存
- max-age:缓存保质期,是相对时间
注意
实际上Cache-Control: no-cache 是会被缓存的,是协商缓存的标识,只不过每次都会向服务器发起请求,来验证当前缓存的有效性 Cache-Control: no-store:这个才是响应不被缓存的意思
Last-Modified
文件在服务器最后被修改的时间,从服务器 Response Headers 上获取
验证流程
ETag
memory cache 与 disk cache 的区别?
总结
未完成待续。。。。