强缓存、协商缓存

193 阅读2分钟

为了减少资源请求次数,加快资源访问速度,浏览器对资源文件如图片、css文件、js文件等有一个缓存功能,而浏览器缓存策略又分为强缓存和协商缓存。

强缓存

强缓存即强制缓存,浏览器在访问某个资源时会判断是否使用本地缓存里已经存在的资源文件,若使用本地缓存则不会发送请求到服务器,减轻了服务器压力,并且速度更快。

比如服务器在响应头里面设置 Cache-Controlmax-age=3153600 即代表缓存一年的时间,一年内无需再向服务器发送请求,直接使用本地缓存。

如果使用缓存,在返回的200状态码后会标明 from disk cache 或 memory cache。

除了Cache-Control字段外,还可以使用Expires字段(HTTP1.0规范),Expires字段是一个具体的时间值,代表缓存的有效日期,在该日期内浏览器不会像服务器发起请求,直接中缓存中获取资源。

Expies缺点:Expires参照的是本地客户端的时间,而本地客户端的时间可以被任意修改,不准确。

Cache-Control的优先级高于Expires。

协商缓存

协商缓存指的是服务端和客户端协商是否使用缓存,即浏览器每次都会发送请求询问服务端是否使用缓存。

浏览器初次请求资源,服务器返回资源的同时会生成一个Etag值携带在响应头中,当浏览器再次请求资源时会将这个值作为If-None-Match字段携带在请求头中,服务器收到该值后与资源文件最新的Etag值做对比如果没有变化则返回304状态码告诉浏览器使用缓存(不返回资源文件),如果发生变化则返回200状态码和最新的资源文件。

除了Etag字段外,服务端还可以返回Last-Modified字段(HTTP1.0规范),浏览器请求头携带Last-Modified-since,它们的值是一个时间值,服务器通过对比文件的修改时间是否发生改变来判断是否使用缓存。

Last-Modified缺点:可能资源文件没有改变但是修改时间改变了,这时候服务端也认为资源文件改变了并返回资源,不走缓存。

Etag的优先级高于Last-Modified。

强缓存的优先级高于协商缓存。