前言浏览器的缓存机制就是我们所说的HTTP缓存机制，它的机制是基于HTTP报文的缓存标识符。HTTP缓存缓存过程：第一次请求：没有缓存结果和缓存ID，直接向服务器发送请求强缓存：缓存结果和缓存ID存在，且结果还没有过期，强制缓存生效，直接返回缓存协商缓存：有缓存标识和缓存结果，但已过期。如果强制缓存无效，则使用协商缓存。1.强缓存。强制缓存是从浏览器缓存中查找请求结果，根据结果的缓存规则决定是否使用缓存结果。处理条件：Cache-Control的max-age未过期或Expires的缓存时间未过期结果：直接使用浏览器的缓存数据，不会向服务器发送任何请求①。Cache-ControlHTTP1.1中启用了Cache-Control来控制页面是否缓存，在服务器端配置了Cache-Control属性。不同的服务器有不同的配置，使用相对时间的概念。Cache-Control属性设置：(1)．max-age：设置缓存的最大有效时间，单位秒（s）。max-age将覆盖Expires(2)。s-maxage：仅用于共享缓存，如CDN缓存(s->share)。与max-age的区别在于：max-age用于普通缓存，而s-maxage用于代理缓存。如果s-maxage存在，它将覆盖max-age和Expires(3)。public：响应将被缓存并在多个用户之间共享。默认值为公共(4)。private：响应仅用作私有缓存，不能在用户之间共享。如果需要HTTP身份验证，响应将自动设置为private(5)。no-cache：指定不缓存响应，表示不缓存该资源。但是，设置no-cache并不代表浏览器不缓存，而是在缓存（即协商缓存）之前与服务器确认资源是否被更改过（6）。no-store：绝对禁止缓存（7）。must-revalidate：如果页面过期，去服务器端获取。目前，Cache-Control请求域在各种浏览器中都有很好的支持，优先级也比较高。当与其他字段（如Expires）一起使用时，其他字段将被覆盖。②.Expires缓存过期时间，用于指定资源过期的时间，是服务器端的具体时间点。也就是说，Expires=max-age+请求时间需要和Last-modified结合使用。Expires是HTTP/1的产物，受本地时间限制。如果本地时间被修改，缓存可能会失效。Expires属性也在服务器端配置。2.协商缓存协商缓存是在强制缓存失效后，浏览器向服务器发送带有缓存标识的请求，服务器根据缓存标识决定是否使用缓存的过程。条件：强制缓存max-age和Expires均已过期（或未设置）缓存是新鲜的，然后根据新鲜度返回304或者200①。Last-Modified和If-Modified-Since流程：浏览器首先发送请求，要求服务器在响应头中返回请求资源的最后更新时间，也就是last-modified，浏览器会将这次Cache。然后在浏览器的下一次请求中，请求头中包含if-modified-since:[savedlast-modifiedvalue]。比较浏览器发送的修改时间和服务器的修改时间。如果一致，说明资源没有变化。服务器返回一个空文本的响应，允许浏览器从缓存中读取资源。②.ETag和If-None-Match流程：浏览器会先发送请求获取etag的值，然后在下一次请求的请求头中带上if-none-match:[etag的保存值]。将发送的etag值与服务器重新生成的etag值进行比较。如果一致，说明资源没有变化，服务器返回一个空文本的响应，告诉浏览器从缓存中读取资源。etag可以解决last-modified的一些缺点，但是etag每次生成server都需要进行读写操作，而last-modified只需要读操作，性能开销更大。用户行为及浏览器缓存的禁止1、用户行为对浏览器缓存的影响①打开网页，在地址栏输入地址：查看磁盘缓存中是否有匹配。可用时使用；如果没有，发送网络请求。②普通刷新（F5）：不关闭TAB，先使用内存缓存（如果匹配），再使用磁盘缓存。③强制刷新（Ctrl+F5）：浏览器没有使用缓存，所以发送的请求头都有Cache-control:no-cache（为了兼容，Pragma:no-cache也包括在内），服务器直接返回200和最新内容。2、禁止浏览器缓存有时候，我们需要完全禁止浏览器缓存，比如Vue封装的HTML。为了保证用户能得到最新的HTML，需要禁止浏览器缓存。网上有个meta配置no-cache
