动态缓存

概念：

缓存可以说是性能优化中简单高效的一种优化方式了, 一个优秀的缓存策略可以缩短网页请求资源的距离, 减少延迟, 并且由于缓存文件可以重复利用, 还可以减少带宽, 降低网络负荷. 对于浏览器缓存, 相信大家对它真的是又爱又恨. 一方面极大地提升了用户体验, 而另一方面有时会因为读取了缓存而展示了已经过期的数据, 而在开发过程中千方百计地想把缓存禁掉

相关状态码：

200 (form memory cache) 不请求网络资源，从内存中读取资源，一般脚本、字体、图片会存在内存当中

200 (form disk cache) 不请求网络资源，从磁盘中读取资源，一般非脚本会存在内存当中，如css等

200 (1kb) 从服务器下载最新资源(1kb即资源的大小)

304 (1kb) 请求服务端发现资源没有更新，使用本地资源(1kb即报文的大小)

以上是chrome在请求资源是最常见的几种http状态码

前两种200状态码是不需要浏览器请求服务器的, 直接从本地读取资源, 所以速度是最快的, 而304状态码也是缓存, 只不过需要浏览器先请求服务器, 这种是协商缓存

相关HTTP包头信息：

last-modified

last-modified格式类似这样：
last-modified : Fri , 12 May 2006 18:53:33 GMT

客户端第二次请求此URL时，根据HTTP协议的规定，浏览器会向服务器发送if-modified-since报头，询问该时间之后文件是否有被修改过：
if-modified-since : Fri , 12 May 2006 18:53:33 GMT

如果服务器端的资源没有变化，则返回 304（Not Changed）状态码，内容为空，这样就节省了传输数据量，当服务器端代码发生改变或者重启服务器时，则重新发出资源，返回和第一次请求时类似，从而保证不向客户端重复发出资源，也保证当服务器有变化时，客户端能够得到最新的资源

etag

HTTP协议规格说明定义etag为“被请求变量的实体值”，另一种说法是，etag是一个可以与Web资源关联的记号（token），典型的Web资源可以一个HTML文档，但也可能是JSON或XML文档，服务器单独负责判断记号是什么及其含义，并在HTTP响应头中将其传送到客户端，以下是服务器端返回的格式：
etag:“50b1c1d4f775c61:df3”

客户端的查询更新格式是这样的：
if-none-match : W / “50b1c1d4f775c61:df3”

如果etag的值没有发生改变，则返回 304（Not Changed）状态码，这也和last-modified一样，etag在断点下载时会非常有用

cache-control

cache-control 是最重要的规则，这个字段用于指定所有缓存机制在整个请求/响应链中必须服从的指令，这些指令指定用于阻止缓存对请求或响应造成不利干扰的行为，这些指令通常覆盖默认缓存算法，缓存指令是单向的，即请求中存在一个指令并不意味着响应中将存在同一个指令

简单来说, 当同时存在last-modified以及etag还有cache-control这个3个属性时, cache-control的优先级是最高的

cache-control有以下几个值:
public 所有内容都将被缓存
private 内容只缓存到私有缓存中
no-cache 所有内容都不会被缓存
no-store 所有内容都不会被缓存到缓存或 Internet 临时文件中
must-revalidation/proxy-revalidation 如果缓存的内容失效，请求必须发送到服务器/代理以进行重新验证
max-age=xxx (xxx is numeric) 缓存的内容将在 xxx 秒后失效, 如果和Last-Modified一起使用时, 优先级更高

操作步骤：

在未配置浏览器缓存之前，我们可以请求一下默认站点，同时用开发者模式去看一下HTTP请求和响应头，对应的参数，在文档开头有讲解

修改配置文件，在我指定的location中加入“expires”缓存参数

检查语法并重启服务

再次刷新请求，可以看到我们配置的缓存已生效，资源会被缓存至本地浏览器一个小时，默认单位按秒计算