概述

缓存策略

浏览器缓存策略分为两种：

1. 强缓存

2. 协商缓存

相同点

如果命中，都是从缓存中加载资源

不同点

协商缓存会向服务器发起请求去验证是否命中缓存，而强缓存不需要发送请求

基本原理

• 浏览器加载资源时候，会根据请求头的expire和cache-control判断是否命中强缓存，是则从缓存中读取资源，不会发送请求到服务器

• 如果没有命中强缓存，浏览器就会携带if-None-Match：上一次Etag的值和if-Modified-Since: 上一次last-modified的值，发送请求到服务器，验证是否命中协商缓存，如果命中，则继续从缓存中读取资源

• 如果没有命中缓存，则直接从服务器加载资源

强缓存

Expires

Expires是HTTp/1.0控制网页缓存的字段，其值是服务器返回改请求结果缓存的到期时间，是个绝对时间。

Expires控制缓存的原理，是使用客户端的时间与服务器端返回的时间做对比，如果客户端与服务器端的时间发生误差（如时区不同，修改了客户端时间），那么强缓存就会失效。

Cache-Control

主要取值

浏览器缓存存放位置

内存缓存

内存缓存具有两个特点：

• 快读读取： 内存缓存会将编译解析后的文件直接存入改进程的内存中，占据该进程一定的内存资源，方便下次运行使用时的快速读取

• 时效性： 一旦该进程关闭，则该进程的内存会清空

硬盘缓存

硬盘缓存是直接将缓存写入硬盘中，读取缓存需要对该缓存存放的硬盘文件进行I/O操作，然后重新解析该缓存内容，读取复杂，速度比内存缓存（memory cache）慢

协商缓存

协商缓存就是强制缓存失效后，浏览器携带缓存标识向服务器发起请求，由服务器根据缓存标识决定是否使用缓存。

控制协商缓存的字段分别为： Last-Modified/if-Modified-Since和 Etag/if-None-Match

其中 Etag/if-None-Match的优先级更高

Last-Modified / if-Modified-Since

Last-Modified 是服务器响应请求时，返回该资源文件在服务器最后被修改的时间

当服务器收到该请求，并且发现请求头有if-Modified-Since字段时，就会将该值与该资源在服务器的最后修改时间做对比，如果有更新就重新返回资源，状态码为200；如果没有更新，则返回304，继续使用缓存文件

Etag / If-None-Match

Etag是服务器响应请求时，返回当前资源文件的一个唯一标识（由服务器生成）

当服务器接收到请求，并且发现请求头有If-None-Match时，就会将该值与资源在服务器的Etag值做对比，一致则代表资源没有更新，返回304，使用缓存文件；不一致则重新返回资源文件，状态码为200

禁止浏览器缓存

了解更多，请点击：https://www.bilibili.com/video/BV13p4y167vu

原作者：阿婧

原出处：掘金

原文链接：https://juejin.cn/post/6909739162463633415