http协商缓存与强缓存

概述

良好的缓存策略可以降低资源的重复加载,提高网页的整体加载速度。通常浏览器的缓存策略分为两种:强缓存和协商缓存。

基本原理

  1. 浏览器在加载资源的时候,会先根据这个资源的一些http header判断他是否命中强缓存,强缓存如果命中,浏览器直接从自己的缓存中读取资源,不会发请求到服务器。
  2. 当强缓存没有命中的时候,浏览器一定会发送一个请求到服务器,通过服务器端一句资源的另外一些http header严重这个资源是否命中协商缓存,如果协商缓存命中,服务器会将这个请求返回,但不是返回这个资源的数据,而是告诉客户端可以直接从缓存中加载这个资源,于是浏览器又会从自己的缓存中去加载这个资源。
  3. 强缓存与协商缓存的共同点是:如果命中,都是从客户端缓存中加载资源,而不是从服务器加载资源数据。区别是:强缓存不发请求到服务器,协商缓存会发请求到服务器。
  4. 当协商缓存也没有命中的时候,浏览器直接从服务器加载资源数据。

浏览器发起请求处理过程

第一次请求

FirstRequest.png

后续请求

OtherRequest.png

强缓存

强缓存通过ExpiresCache-Control两种响应头来实现。

Expires

Expires是http1.0提出的一个表示资源过期的header,他描述的是一个绝对时间,由服务器返回。Expires受限于本地时间,如果修改了本地时间,可能会造成缓存失效。

1
Expires: Wed, 11 May 2018 07:20:00 GMT

Cache-Control

Cache-Control出现于http/1.1,优先级高于Expires,表示的是相对时间。

1
Cache-Control: max-age=315360000

协商缓存

当浏览器对某个资源的请求没有命中强缓存,就会发一个请求到服务器,验证协商缓存是否命中,如果协商缓存命中,请求响应返回的http状态为304并且会显示一个Not Modified字符串。

协商缓存是利用Last-Modified,If-Modified-SinceETag,If-None-Match这两对Header来管理的。

Last-Modified,If-Modified-Since

Last-Modified表示本地文件最后修改的日期,浏览器会在request header加上If-Modified-Since(上次返回的Last-Modified的值),询问服务器在该日期后资源是否有更新,有更新的话就会将新的资源发送回来。

但是如果本地打开缓存文件,就会造成Last-Modified被修改,所以在http/1.1出现了ETage。

ETage、If-None-Match

ETag就像一个指纹,资源变化都会导致ETag变化,跟最后修改的时间没关系,ETag可以保证每一个资源是唯一的。

If-None-Match的header会将上次返回的ETag发送给服务器,询问该资源的ETag是否有更新,有变动就会发送新的资源回来。

ETag.png

ETag的优先级比Last-Modified更高。

为什么要用ETag

  1. 一些文件也许会周期性的更改,但是他的内容并不改变(仅仅改变的修改时间),这个时候我们并不希望客户端认为这个文件被修改了,而重新GET;
  2. 某些文件修改非常频繁,比如在秒以下的时间内进行修改,(比方说1s内修改了N次),If-Modified-Since能检查到的粒度是s级的,这种修改无法判断(或者说UNIX记录MTIME只能精确到秒);
  3. 某些服务器不能精确的得到文件的最后修改时间。

总结

强缓存与协商缓存的区别

获取资源形式 状态码 发送请求到服务器
强缓存 从缓存获取 200(from cache) 否,直接从缓存获取
协商缓存 从缓存获取 304(not modified) 通过服务器告知缓存是否可用

几种状态码的区别

状态码 作用
200 强缓Expires/Cache-Control存失效时,返回新的资源文件
200(from cache) 强缓Expires/Cache-Control两者都存在,未过期,Cache-Control优先Expires时,浏览器从本地获取资源成功
304(Not Modified) 协商缓存Last-modified/Etag没有过期时,服务端返回状态码304

如何选择缓存

协商缓存需要配合强缓存使用,如果不启用强缓存,协商缓存没有意义。

大部分web服务器都默认开启协商缓存,而且是同时开启Last-Modified,If-Modified-SinceETag,If-None-Match

特殊场景:

  1. 分布式系统里多台机器间的Last-Modified必须保持一致,以免负载均衡到不同机器导致比对失败。
  2. 分布式系统尽量关掉ETag(每台机器生成的ETag都会不一样)。

Reference

http协商缓存VS强缓存

彻底捋一捋缓存(二)——浏览器缓存机制:强缓存、协商缓存