http缓存

Cache-Control(请求头部):

1. max-age(单位为s): 指定缓存的最大有效时间，指定的是时间段，而不是时间点。当浏览器向服务器发送请求后，在max-age这段时间里浏览器不会再向服务器发送请求了。即使服务器上的资源发生了变化，浏览器也不会得到通知。max-age会覆盖掉Expires。
2. s-maxage(单位为s)：同max-age，但是max-age针对普通缓存，s-maxage用于代理缓存，比如CDN缓存。s-maxage会覆盖max-age和Expires。
3. no-cache：指定不缓存响应，表明资源不进行缓存。但是设置了no-cache之后并不代表浏览器不缓存，而是在缓存前要向服务器确认资源是否被更改。
4. no-store：指示缓存不存储此次请求的响应部分，与no-cache比较来说，一个是不用缓存，一个是不存储缓存

Expires(响应头部)

指定缓存过期时间，是服务器端具体的时间点，Expires=请求时间+max-age， 需要结合Last-modified使用。属于服务器响应消息头字段，在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存存取数据。

Last-modified(响应头部) If-Modified-Since(请求头部)

服务器端文件的最后修改时间，和Cache-Control结合使用。服务器端响应一个http请求时，响应头部会包含Last-modified字段，表明服务器端文件的最后修改时间，浏览器再次请求时，会将请求头部的If-Modified-Since字段设置为上一次响应传回的Last-modified中的值，并传给服务器，询问这个时间点之后资源是否被修改过，如果没有修改过，服务器端返回304状态码，浏览器使用缓存，如果修改过，则再次去服务器端请求资源，服务器响应返回码为200.

ETag(响应头部) If-None-Match/If-Match(请求头部)

根据实体内容生成一段hash字符串，标识资源的状态，由服务端产生。浏览器向服务器端发送一个http请求时，服务器会生成一个ETag，表示资源的状态，包含在响应头部ETag字段返回给浏览器，浏览器再次请求这个页面时，请求头部会包含这个在If-None-Match或者If-Match字段中包含这个ETag，服务器端收到请求后会检查发送过来的ETag和计算出来的ETag是否匹配，如果不匹配，返回200，匹配，返回304。

ETag解决了Last-modified无法解决的问题：

1. 一些文件修改时间改变了，但是内容没有改变，此时使用Last-modified会认为资源更新了，而ETag不会
2. Last-modified只能精确到秒，如果资源修改非常频繁，在秒一下的时间进行修改，Last-modified无法正确响应。
3. 某些服务器不能精确的得到文件的最后修改时间，这样就无法通过最后修改时间判断资源是否更新。

!(缓存流程图)[http://cdn.alloyteam.com/wp-content/uploads/2016/03/图片61.png]

禁用缓存

1. 在meta标签中设置，HTTP-EQUIV属性为名称/值对提供了名称，CONTENT提供了值。使用带有 http-equiv 属性的 标签时，服务器将把名称/值对添加到发送给浏览器的响应头部。

   <META HTTP-EQUIV="pragma" CONTENT="no-cache"> <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"> <META HTTP-EQUIV="expires" CONTENT="0">

2. 动态设置setRequestHeader

3. 请求端设置If-Modified-Since为已经过期的某个时间。
4. 服务器端设置Expires为某个过期时间。
5. url后加时间戳
6. url后加随机数

localStorage/sessionStorage

cookie

参考资料：
浅谈Web缓存