前言
本文是阅读文章所做笔记。意在加深记忆也便于日后查找
强缓存和协商缓存
http的缓存机制可以分为两种类型：
- 强缓存：浏览器判断本地缓存未过期，就直接使用，无需发起http请求
- 协商缓存： 浏览器判断本地缓存过期，发送http请求，服务器返回304告诉浏览器文件未改变，浏览器继续使用本地缓存
缓存头部
如何区分缓存类型呢？主要根据http头部字段
属于强缓存控制：
- http1.0:
Pragma/Expires - http1.1:
Cache-Control/Max-Age
ps:Max-Age不是一个头部，而是Cache-Control的值
属于协商缓存控制：
- http1.0:
If-Modified-Since/Last-Modified - http1.1:
If-None-Match/E-tag
http1.0和http1.1缓存头部控制的区别
在http1.0中：
-
Pragma: 严格说，他不属于专门控制缓存的头部，但是当其值为no-cache时可以让本地强缓存失效 -
Expires: 在服务端配置，用于强缓存。用来控制在规定时间之前，浏览器不需要在发出请求，直接使用本地缓存。切Expires是服务端时间 -
If-Modified-Since/Last-Modified: 这两个是成对出现。属于协商缓存。其中浏览器端头部为If-Modified-Since,服务器端为Last-Modified。在发送请求时，如果If-Modified-Since和Last-Modified匹配，那么表示服务器资源为变化，服务器不会返回当前资源。而是返回头部，告知浏览器使用本地缓存。Last-Modified是指文件的最后修改时间。只能精确到1s以内。
在http1.1中：
-
Cache-Control：缓存控制的头部。有no-cache, max-age,no-store等值。 -
Max-Age：服务器端配置，用于强缓存，例如Cache-Control=max-age=3600在3600秒内，浏览器无需再次发出请求直接使用本地缓存。他的值是绝对时间，由浏览器自己计算。 -
If-None-Match/E-tag： 这个是成对出现的。属于协商缓存。其中浏览器端头部为If-None-Match,服务器端为E-tag。当浏览器发出请求后两者匹配，则表示服务器端资源未改变，服务器不会返回资源本身，返回头部，浏览器使用本地缓存。和Last-Modified相比。E-tag更精确。没有1s的误差。
Max-Age 和 Expires 区别
Expires 使用的服务器时间。当服务器时间和浏览器时间不同步时，可能会发生缓存无效或一直无法过期的bug。
而E-tag 使用的浏览器时间。就不会存在上述问题。
E-tag 和 Last-Modified 区别
Last-Modified 表示的是文件的最后修改时间，有一个精确1s的缺陷，如果服务端的文件周期性改变，会导致缓存失效。
而E-tag是一种指纹机制。只有文件发生改变才会变化。不存在1s的缺陷。
缓存关系图
缓存关系图
