![](https://img-blog.csdnimg.cn/31b3479814f74acbb70b9f63f2e80012.gif)
⭐️ 本文首发自 前端修罗场(点击加入社区,参与学习打卡,获取奖励),是一个由资深开发者独立运行的专业技术社区,我专注 Web 技术、区块链、Web 3、答疑解惑、面试辅导以及职业发展。。
1. 对浏览器的缓存机制的理解
- 浏览器第一次加载资源,服务器返回 200,浏览器从服务器下载资源文件,并缓存资源文件与
response header
,以供下次加载时对比使用; - 下一次加载资源时,由于强制缓存优先级较高,先比较当前时间与上一次返回
200
时的时间差,如果没有超过cache-control
设置的max-age
,则没有过期,并命中强缓存,直接从本地读取资源。如果浏览器不支持HTTP1.1
,则使用expires
头判断是否过期; - 如果资源已过期,则表明强制缓存没有被命中,则开始协商缓存,向服务器发送带有
If-None-Match
和If-Modi