彻底缓存与协商缓存（浏览器缓存）

前言：

浏览器缓存也称http在浏览器向服务器请求资源的时候，许多静态的资源是长时间不会更改的。如果重复的发起请求，不断从服务器获取长时间不会改变的资源，不仅会浪费宽带，增加服务器的压力，甚至影响到用户的体验。

通过浏览器缓存就能设置资源缓存。缓存后能减少资源的请求、减少响应的时间。

浏览器缓存：

• 客户端向服务器发起请求时，会根据HTTP响应头的字段加载缓存的资源。
• 浏览器缓存从第二次开始。第一次请求从服务器加载所有资源，第二次请求浏览器根据响应头的字段加载缓存资源。
• 浏览器缓存分为 彻底缓存 与 协商缓存。命中协商缓存会向服务器发起请求（服务器会分析数据客户端数据是否需要更新），彻底缓存不会向服务器发起请求。

彻底缓存（Cache-Control）：

彻底制缓存在客户端本地，请求直接从本地缓存中加载，不去请求服务器，返回的状态码是 200。彻底缓存需要 Cache-Control 字段， Cache-Control 是 HTTP 响应头中的字段。你可能在网上会看到有人会说还有 expires，pragma ，但都是 http1.0 的产物，现在应用最广泛的是 http1.1。所以我们减少一点学习压力，熟悉 Cache-Control 字段即可。

当我们向服务器请求资源时，服务器认为需要被缓存的资源比如（css，js文件 、图片），这些资源在响应头中都会默认携带 Cache-Control: public, max-age=0 。public, max-age=0 是默认值（相当于没有对资源缓存进行处理）。

Cache-Control 属性值：

彻底缓存依赖 Cache-Control 字段，所以我们需要熟悉该字段的属性值，多个属性值用逗号隔开。

1. public			这些资源可以被任意对象缓存（如：客户端，代理服务器，等等）
2. private			这些资源只能在客户端缓存
3. max-age=xx		设置资源缓存的最大时间，超过时间表示缓存过期，请求会发到服务器（单位：秒）
4. no-cache			加载缓存资源前，强制发送请求到服务器进行“协商缓存”
5. no-store			不被做任何缓存

客户端浏览器缓存：

• 客户端浏览器缓存分为：内存缓存(memory-cache)、硬盘缓存(disk-cache)

打开浏览器控制台，选择Network（网络），再刷新浏览器，我们就能看到请求资源详情：

一般频繁操作的文件都缓存在内存中，加载十分迅速。操作不频繁的文件就会缓存在硬盘中，加载速度也会较慢。

到底什么文件会缓存在内存中、什么会缓存在硬盘中，我们并不需要关心，让浏览器自己决定就行。我们只需要知道后面的请求可以直接走缓存，而不用请求服务器获取资源。其实就是博主也不明白😆，但好像确实不用深究（强行续命一秒钟😏），不过有明白的小伙伴欢迎留言。

协商缓存（Etag）：

请求的资源通过资源标识与服务器协商比对，协商成功，服务器返回304状态码，浏览器从本地加载。协商缓存需要用到 Etag 字段 与 if-none-match，Etag 是 HTTP 响应头中的字段，Etag 的值是根据资源内容编码生成的一段字符串（资源标识），内容不同就会生成不同的Etag。你可能在网上看到还有 Last-modified ，了解即可。

再次发起请求时，请求头会带有 if-none-match 字段，值为上一次响应的 Etag（没有则不会携带）。服务器会将请求的资源生成资源标识与发送过来的值进行比对，比如果比对成功则返回 304 状态码，浏览器从本地加载该资源。

如果协商失败服务器会返回新的资源+新的Etag（资源标识）。

补充：如果不想命中协商缓存与彻底缓存，win系统可以直接 ctrl + f5 或 ctrl+shift+r