强缓存（本地缓存）
1. 概念
直接使用本地的缓存，不用跟服务器进行通信
2. 相关header字段
2.1 expires
一个未来时间，代表请求有效期，没有过期之前都使用当前请求。
eg:
Thu , 15 Apr 2099 20:00:00 GMT ，代表 2099 年4月16日请求过期，在这之前当前请求都有效。
2.2cache-control,优先级高于 expires。
value 是一个时间段，请求有效的最大时间段，限制：1.需要记住请求时间还需要计算是否在这个时间段内 2. 服务器与客户端时间必须一致。
因为它是一个时间段，所以意味着，可以设置一些默认值，常见的默认值设置：
no-cache：不使用本地缓存。向浏览器发送新鲜度校验请求
pubilc：任何情况下都缓存（即使是HTTP认证的资源）
private：只能被终端用户的浏览器缓存，不允许CDN等中继缓存服务器对其缓存
no-store：禁止浏览器缓存数据，也禁止保存至临时文件中，每次都重新请求，多次设置 cache-control，优先级最高
3. F5 刷新后无效，Ctrl + F5 强制刷新后无效
强制缓存如何重新加载缓存过的资源？
更新页面中引用的资源路径，让浏览器主动放弃缓存，加载新资源
协商缓存
1. 概念
将资源一些相关信息返回服务器，让服务器判断浏览器是否能直接使用本地缓存，整个过程至少与服务器通信一次
2. 相关header字段
Last-Modified/If-Modified-Since（两个都是时间格式字符串）
过程：
1. 浏览器第一次发请求，服务器在返回的 respone 的 header 加上 Last-Modified，表示资源的最后修改时间
2. 再次请求资源，在 requset 的 header 加上 If-Modified-Since ，值就是上一次请求返回的 Last-Modified 值
3. 服务器根据请求传过来的值判断资源是否有变化，没有则返回 304，有变化就正常返回资源内容，更新 Last-Modified 的值
4. 304 从缓存加载资源，否则直接从服务器加载资源
3. Etag/If-None-Match（标识符字符串）
与 Last-Modified/If-Modified-Since 不同的是，返回 304 时，ETag 还是会重新生成返回至浏览器。
4. 优点
有些文件可能会周期性更改，但内容并没有修改时，用 Etag 就不用重新拉取；
1S 内修改的文件也会检测到；
优先级高于 Last-Modified。
5.为什么协商缓存有两个属性一起出现：
协商缓存是浏览器判断资源是否可用，所以需要两个标识，第一个是第一次请求的响应头带上某个字段（Last-Modified或者Etag），第二个则是后续请求带上的对应请求字段（If-Modified-Since或者If-None-Match），两个标识一起出现才有意义，单独则没有什么效果。
6. F5 刷新后依然有效，Ctrl + F5 强制刷新后无效
网友评论