浏览器的缓存机制

缓存分类

web缓存分为很多种，比如数据库缓存、代理服务器缓存、CDN缓存，以及浏览器缓存。
浏览器通过代理服务器向源服务器发起请求的原理如图。

浏览器先向代理服务器发起Web请求，再将请求发到源服务器。它属于共享缓存，所以很多地方都可以使用其缓存资源，所以节省了很多流量。

浏览器缓存

浏览器缓存是将文件保存在客户端。在同一个回话过程中检查缓存的副本是否足够新，在后退网页时，访问过的资源可以从浏览器缓存中拿出来使用。

浏览器一般都是通过http缓存的，但是也可以通过其他方式，如在html页面中的meta标签增加属性，但不是所有浏览器都支持的，因为有些浏览器不能理解HTML内容本身

<meta HTTP-EQUIV="Pragma" CONTENT="no-cache" />

HTTP中的header来控制的缓存

大多数的浏览器缓存都是有http的header所决定的。

Expires

Expires: 是Web服务器响应消息头字段，在响应http请求时告诉浏览器在过期时间内浏览器可以直接从浏览器缓存读取数据，无需再次请求。但是Expires是HTTP1.0的东西，在HTTP1.1中，他的作用基本上可以忽略。

1.max-age 指定设置缓存最大的有效时间，定义的是时间长短。当浏览器向服务器发送请求后，在max-age这段时间里，浏览器就不会再向服务器发送请求了。

2.s-maxage与max-age一样，只用于共享缓存（如CDN缓存）。如s-maxage=60,在这60秒呢，即使更新了CDN的内容，浏览器呀不会发送请求。max-age用于普通缓存，而s-maxage用于代理缓存。如果存在s-maxage，则会覆盖掉max-age和Expires header.

3.public指定响应会被缓存，并且在多用户间共享。默认是public。

private响应只为私有缓存，不能在用户间共享

4.设置no-chache表明资源不进行缓存，但是设置了no-cache之后，并不代表浏览器不缓存，而是在缓存前要向浏览器确认资源是否被更改。有的时候只设置no-cache防止缓存还是不够保险，还可以加上private指令，将过期时间设为过去的时间。

Cache-control策略

Cache-control策略：与Expires的作用是一致的，都是指当前资源的有效期，控制浏览器是直接从浏览器缓存中存取数据，还是重新发送请求到服务器取数据。它的优先级高于Expires,而且它的选择更多，设置也更细致。

1. Last-Modified/If-Modified-Since

Last-Modified/If-Modified-Since要配合Cache-Control使用

• Last-Modified: 表示这个资源的最后修改时间。Web服务器在响应请求时，告诉浏览器资源的最后修改时间。当浏览器再次进行请求时，会向服务器传送If-Modified-Since抱头，询问Last-Modified时间点之后资源是否被修改。

• If-Modified-Since: 当资源过期时（用Cache-Control标识的max-age）,发现资源具有Last-Modified声明，则再次向Web服务器请求头带上If-Modified-Since,表示请求时间。Web服务器收到请求后发现有头信息If-Modified-Since，则与被请求资源的最后修改时间进行比较。若最后修改时间比较新，说明资源修改过，则返回相应整片资源内容（卸载响应消息包体内），HTTP Code为200; 若最后修改时间比较旧，说明资源没有更新，则相应的HTTP Code为304，告诉浏览器使用所保存的缓存。

1. ETag/If-None-Match

ETag/If-None-Match: 也要配合Cache-Control使用

• ETag：web服务器相应请求时，告诉浏览器当前资源在服务器的唯一标识（生成规则由服务器产生）。Apache中，ETag的值，默认是对文件的索引节（INode），大小（Size）和最后修改时间（MTime）进行Hash后得到的。

• If-None-Match:当资源过期时（使用Cache-Control标识的max-age），发现资源具有ETag声明，则再次向Web服务器请求时带上头信息If-None-Match（ETag的值）。Web服务器收到请求后，头信息If-None-Cache与被请求的资源进行校验串比较，然后返回200或者304.

  

你可能觉得Last-Modified已经足够让浏览器知道本地缓存是否是最新的，为什么还是要增加ETag呢？
HTTP1.1中的ETag的出现主要为了解决几个Last-Modified中比较难解决的问题：

• Last-Modifed标注的最后修改只能精确到秒，如果某些文件在1秒以内，被修改多次的话，它将不能准确标注文件的修改时间

• 某些文件会被定期生成，当时内容并没有发生任何变化，但Modified却变了，导致文件没法使用缓存

• 有可能存在服务器没有准确获取文件修改时间，或者与代理服务器的时间不一致等情形

ETag是服务器自动生成，或者由开发者对生成的对应资源在服务器端的唯一标识符，能够更加准确的控制缓存。Last-Modified与ETag可以一起使用，服务器会优先验证ETag，一致的情况下，才会继续对Last-Modifed，最后才决定是否返回304.

cache-control指令的使用

用户行为和缓存

几篇不错的缓存的文章

浏览器缓存知识小结及应用
浏览器缓存