HTTP缓存

一、什么是HTTP缓存？

​ 当浏览器访问某个网站，如果是第一次访问，需要加载这个网站的资源，html,css,js,img…服务需要返回这些资源。

​ 利用缓存的策略，当第二次、第三次…访问这个网站的时候，以上的流程可不重复执行就可以获取到资源。以此提高网站的加载速度。

二、为什么要HTTP缓存？

​ 从输入网站地址，到加载出页面，包括三个主要过程，CPU计算、页面渲染、http请求，前两者速度很快，不确定因素较少，http请求受网络环境影响较大，快时快，慢时可达几百甚至一秒的时间，如果这时利用缓存的方式，减少网络请求的体积和数量，就能加快网站加载的速度。

三、memory cache 和 disk cache 缓存

​ 缓存读取的原理：先从内存中查找对应的缓存，如果内存中能找到就读取对应的缓存，否则的话就从硬盘中查找对应的缓存，如果有就读取，否则的话，就重新网络请求。

​ 区别如下：

	memory cache	disk cache
定义	将资源文件缓存到内存中。等下次请求访问的时候不需要重新下载资源，而是直接从内存中读取数据。	它是将资源文件缓存到硬盘中。等下次请求的时候它是直接从硬盘中读取。
退进程策略	退出进程时数据会被清除	退出进程时数据不会被清除
速度	内存读取比硬盘中读取的速度更快。	内存读取比硬盘中读取的速度更快。
资源类别	脚本、字体、图片	一般非脚本会存放在硬盘中，比如css这些

三、浏览器缓存它又分为2种：强制缓存和协商缓存。

四、什么是强制缓存？

​ 是否设置缓存，是否设置cache-control，都服务器决定，前端不需要做任何的事情

**基本原理：**浏览器在加载资源的时候，会先根据本地缓存资源的header中的信息(Expires 和 Cache-Control)来判断是否需要强制缓存。如果命中的话，则会直接使用缓存中的资源。否则的话，会继续向服务器发送请求。

Expires

Expires 是http1.0的规范，它的值是一个绝对时间的GMT格式的时间字符串。这个时间代表的该资源的失效时间，如果在该时间之前请求的话，则都是从缓存里面读取的。但是使用该规范时，可能会有一个缺点就是当服务器的时间和客户端的时间不一样的情况下，会导致缓存失效。

Cache-Control

Cache-Control 是http1.1的规范，它是利用该字段max-age值进行判断的。该值是一个相对时间，比如 Cache-Control: max-age=3600, 代表该资源的有效期是3600秒。除了该字段外，我们还有如下字段可以设置：

no-cache: 需要进行协商缓存，发送请求到服务器确认是否使用缓存。

**no-store：**禁止使用缓存，每一次都要重新请求数据。

**public：**可以被所有的用户缓存，包括终端用户和 CDN 等中间代理服务器。

**private：**只能被终端用户的浏览器缓存，不允许 CDN 等中继缓存服务器对其缓存。

Cache-Control 与 Expires 可以在服务端配置同时启用，同时启用的时候 Cache-Control 优先级高。

五、什么是协商缓存（对比缓存）？

1. **协商缓存原理：**客户端向服务器端发出请求，服务端会检测是否有对应的标识，如果没有对应的标识，服务器端会返回一个对应的标识给客户端，客户端下次再次请求的时候，把该标识带过去，然后服务器端会验证该标识，如果验证通过了，则会响应304，告诉浏览器读取缓存。如果标识没有通过，则返回请求的资源。

2. 协商缓存的标识又有2种：ETag/if-None-Match 和 Last-Modified/if-Modify-Since

3. Last-Modified/if-Modify-Sinc

   浏览器第一次请求某个资源时，服务器会返回一个last-modify到header中，last-modify的含义时最后修改时间。在后续请求时，request的请求头上会带上if-Modify-Since，它的值就是缓存之前返回的last-modify，服务器收到后会与资源的最后修改时间（last-modify）进行对比，如果相等，则命中缓存，返回304；如果Last-Modify > if-Modify-Since, 则会给出200响应，并且更新Last-Modify为新的值

   4.ETag/if-None-Match

​ ETag的原理和上面的last-modified是类似的。ETag则是对当前请求的资源做一个唯一的标识。该标识可以是 一个字符串，文件的size,hash等。只要能够合理标识资源的唯一性并能验证是否修改过就可以了。ETag在服 务器响应请求的时候，返回当前资源的唯一标识(它是由服务器生成的)。但是只要资源有变化，ETag会重新生 成的。浏览器再下一次加载的时候会向服务器发送请求，会将上一次返回的ETag值放到request header 里的 if-None-Match里面去，服务器端只要比较客户端传来的if-None-Match值是否和自己服务器上的ETag是否一 致，如果一致说明资源未修改过，因此返回304，如果不一致，说明修改过，因此返回200。并且把新的Etag 赋值给if-None-Match来更新该值。

五、总结