一文搞懂http缓存

1、http缓存

浏览器第一次向一个web服务器发起http请求后，服务器会返回请求的资源，并且在响应头中添加一些有关缓存的字段如：Cache-Control、Expires、Last-Modified、ETag、Date等等。之后浏览器再向该服务器请求该资源就可以视情况使用强缓存和协商缓存。

• 强缓存：浏览器直接从本地缓存中获取数据，不与服务器进行交互。
• 协商缓存：浏览器发送请求到服务器，服务器判定是否可使用本地缓存。
• 联系与区别：两种缓存方式最终使用的都是本地缓存；前者无需与服务器交互，后者需要。

下面假定浏览器已经访问了服务器，服务器返回了缓存相关的头部字段且浏览器已对相关资源做好缓存。通过下图来分析强缓存和协商缓存：

1.1、强缓存

强缓存由两个http响应头部字段控制，Expires和Cache-Control，其中Cache-Control的优先级比Expires高。
一、Cache-Control：

• max-age(单位为s)指定设置缓存最大的有效时间，定义的是时间长短。当浏览器向服务器发送请求后，在max-age这段时间里浏览器就不会再向服务器发送请求了。
  • max-age>0表示在设置时间内请求直接从浏览器缓存中读取，使用强缓存
  • max-age<=0表示请求到服务器，服务器需要判断文件是否已更新，进而返回200还是304
• no-cache：设置了no-cache之后并不代表浏览器不缓存，而是在缓存前要向服务器确认资源是否被更改。
  • Cache-Control: no-cache, max-age=2000 表示在2000秒内使用强缓存，超过2000秒使用协商缓存
• no-store：禁用缓存。
• public：表明其他用户也可使用缓存，适用于公共缓存服务器的情况。如果没有指定public还是private，则默认为public。
  
• private：表明只有特定用户才能使用缓存，适用于公共缓存服务器的情况。
  
• s-maxage：适用于多用户使用的公共缓存服务器，比如CDN。比如，当s-maxage=60时，在这60秒中，即使更新了CDN的内容，浏览器也不会进行请求。也就是说max-age用于普通缓存，而s-maxage用于代理缓存。如果存在s-maxage，则会覆盖掉max-age和Expires header。

二、Expires：
缓存过期时间，用来指定资源到期的时间，是服务器端的具体的时间点。也就是说，Expires=max-age + 请求时间，需要和Last-modified结合使用。但在上面我们提到过，cache-control的优先级更高。 Expires是Web服务器响应消息头字段，在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据，而无需再次请求。

1.2、协商缓存

当浏览器发现缓存过期后，缓存并不一定不能使用了，因为服务器端的资源可能仍然没有改变，所以需要与服务器协商，让服务器判断本地缓存是否还能使用。

当第一次请求响应头中有ETag或Last-Modified字段，那么第二次请求的请求头中就会携带If-None-Match和If-Modified-Since字段，服务器收到请求后会判断ETag与If-None-Match以及Last-Modified与If-Modified-Since是否一致，如果一致就表示请求资源没有被修改，服务器返回304状态码，使用浏览器缓存资源。如果不一致，则服务器处理请求，返回新资源，状态码为200。

一、ETag和If-None-Match

二者的值都是服务器为每份资源分配的唯一标识字符串，相当于hash。

• 浏览器请求资源，服务器会在响应报文头中加入ETag字段。资源更新时，服务器端的ETag值也随之更新；
• 浏览器再次请求资源时，会在请求报文头中添加If-None-Match字段，它的值就是上次响应报文中的ETag的值；
• 服务器会比对ETag与If-None-Match的值是否一致，如果不一致，服务器则接受请求，返回更新后的资源；如果一致，表明资源未更新，则返回状态码为304的响应，可继续使用本地缓存，要注意的是，此时响应头会加上ETag字段，即使它没有变化。

二、Last-Modified和If-Modified-Since

二者的值都是GMT格式的时间字符串。

• 浏览器第一次向服务器请求资源后，服务器会在响应头中加上Last-Modified字段，表明该资源最后一次的修改时间；
• 浏览器再次请求该资源时，会在请求报文头中添加If-Modified-Since字段，它的值就是上次服务器响应报文中的Last-Modified的值；
• 服务器会比对Last-Modified与If-Modified-Since的值是否一致，如果不一致，服务器则接受请求，返回更新后的资源；如果一致，表明资源未更新，则返回状态码为304的响应，可继续使用本地缓存，与ETag不同的是：此时响应头中不会再添加Last-Modified字段。

三、ETag较之Last-Modified的优势<