浏览器缓存策略

当浏览器请求一个网站的时候，会加载各种各样的资源，比如：HTML文档、图片、CSS和JS等文件。对于一些不经常变的内容，浏览器会将他们保存在本地的文件中，下次访问相同网站的时候，直接加载这些资源，加速访问。这些被浏览器保存的文件就被称为缓存。

浏览器启用缓存的优点：（1）减少页面加载时间；（2）减少服务器负载

浏览器是否使用缓存、缓存多久，是由服务器控制的。准确来说，当浏览器请求一个网页（或者其他资源）时，服务器发回的响应的「响应头」部分的某些字段指明了有关缓存的关键信息。

浏览器缓存机制：

1）浏览器在加载资源时，先根据这个资源的一些http header判断它是否命中强缓存，强缓存如果命中，浏览器直接从自己的缓存中读取资源，不会发请求到服务器。比如：某个css文件，如果浏览器在加载它所在的网页时，这个css文件的缓存配置命中了强缓存，浏览器就直接从缓存中加载这个css，连请求都不会发送到网页所在服务器；

2）当强缓存没有命中的时候，浏览器一定会发送一个请求到服务器，通过服务器端依据资源的另外一些http header验证这个资源是否命中协商缓存，如果协商缓存命中，服务器会将这个请求返回，但是不会返回这个资源的数据，而是告诉客户端可以直接从缓存中加载这个资源，于是浏览器就又会从自己的缓存中去加载这个资源；

3）强缓存与协商缓存的共同点是：如果命中，都是从客户端缓存中加载资源，而不是从服务器加载资源数据；区别是：强缓存不发请求到服务器，协商缓存会发请求到服务器。

4）当协商缓存也没有命中的时候，浏览器直接从服务器加载资源数据。

强缓存 : Expires & Cache-control

强缓存策略会直接从本地拿缓存资源不向服务器发请求，请求状态直接返回状态码200， from cahe 或 from disk

Expires

Expires 是一个GMT格式的时间值，是服务器时间，客户端第一次请求服务器，服务器在返回请求时，会在响应头中带上Expires信息，客户端拿到响应后，会把响应内容和这个响应头一起缓存下来，下一次发请求时，会在缓存中找这个资源，并把Expires和当前时间做对比，如果当前时间小于Expires，则不发送请求，直接从本地缓存拿资源，如果当前时间大于Expires，则会发送请求，从服务器拿资源，同时更新Expires。

使用Expires的强缓存策略有一个缺点，即Expires是服务端时间，但浏览器比对用的当前时间是客户端时间，如果客户端时间被修改，那么可能会出现资源已经过期了，但浏览器不发请求，依然使用过期资源的情况

Cache-control

Cache-control的强缓存策略是设置Cache-control：max-age=315360000； 时间单位为秒，缓存策略过程与上面基本相同，比对的时候是使用当前时间加上max-age 算出过期时间，然后用当前时间与过期时间比较，因为两个比较时间都是用的客户端时间，所以比Expires可靠性要高些，如果同时Expires和Cache-control：max-age, 强缓存策略会优先以Cache-control的 max-age （优先级高）来处理。

协商缓存 Last-Modified & Etag

必须在配置强缓存后协商缓存才生效（不一定要配置强缓存过期，可以配置Cache-control：no-cache, 让强缓存直接过渡到协商缓存），强缓存没命中后，开始协商缓存策略（见上面流程图）。协商缓存会向服务器发请求，如果缓存未过期可用，则服务器返回状态码304，Not Modified

Last-Modified 

客户端第一次向服务器发请求，服务器会在响应头中会加上Last-Modified ，一个GMT格式的时间值，客户端在下一次请求时，会将这个Last-Modified的值写入到请求头If-Modified-Since，服务器再次收到请求时，会将If-Modified-Since与资源最后修改时间做比较，如果没有变化，则只返回304，Not Modified，如果有变化，则返回新资源，并返回新的Last-Modified。 （当返回304，Not Modified， 相当于资源没有改动，故Last-Modified也没有改变，这时Last-Modified不返回）

使用Last-Modified可能会遇到的一个问题是，就是服务器时间被篡改，或资源修改的时候没有更新修改时间，那么就会出现问题，于是引出下面的处理方案。

Etag

处理流程与上面相似，服务器每次收到请求，都会对当前资源生成一个标记，即Etag，客户端拿到服务端返回后，在下一次请求时，会把之前的Etag值放到请求头If-None-Match中，服务器拿到请求，对当前资源生成Etag， 将此Etag和If-None-Match进行对比，如果没区别，则返回304，Not Modified， 同时将Etag返回，如果有区别，则返回资源，并返回Etag。

由于每次请求，服务端都会生成Etag，所以可以解决资源改变，但缓存标记未变，或后端服务器时间被篡改的问题，同时因为每次请求都会根据资源生成新的Etag, 所以在无任何变化，304，Not Modified时同样会返回Etag.