http缓存相关知识

服务器

浏览器缓存也可以叫客户端缓存,是网页性能优化的一大重点,也是在很多攻城狮在工作中部可避免的大问题。在开发阶段我们需要避免缓存带来的问题,而在发布上线后又在想策略管理缓存提升网页的访问速度。

基本知识

浏览器缓存分为强缓存与协商缓存:
1)、浏览器在加载资源时,会先根据这个资源的一些http header判断是否命中强缓存,如果命中浏览器直接从直接的缓存中读取资源,不会发请求到服务器。

2)、当强缓存没有命中的时候,浏览器一定会发送一个请求到服务器,服务器通过请求的另外一些http header验证这个资源是否命中协商缓存,如何协商缓存命中,服务器会将这个请求返回,但不会返回这个资源的数据,而是告诉客户端可以直接从缓存中加载这个资源。

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

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

强缓存

1)、expires(过期时间取客户端时间
expires是HTTP1.0东西,现在浏览器均默认使用HTTP 1.1,所以它的作用基本忽略了。
请求时间小于服务端返回的到期时间,直接使用缓存数据。因为到期时间是由服务器生成的,但是
客户端的时间可能跟服务器端时间有误差,导致缓存命中存在误差。

2)、Cache-control(过期时间取获取到资源算起
Cache-Control最重要的规则,常见的取值有如下:
private: 客户端可以缓存
publish: 客户端和代理服务器都可以缓存
max-age=xxxx 缓存的内容将在xxx秒后失效
no-cache: 需要使用协商缓存来验证缓存数据
no-store: 所有内容都不会缓存

协商缓存

1)、last-Modified、if-Modified-Since
服务器在响应请求时,告诉浏览器资源的最后修改时间。再次请求服务器时,通过此字段通知服务器上次请求时,服务器返回资源最后修改时间。服务器收到请求后发现header有If-Modified-Since 则与被请求资源最后修改时间进行对比。若资源的最后修改时间大于if-Modified-Since,说明资源被改动过,则相应图片资源内容,返回状态码200。若资源的最后修改时间小于或等于if-Modified-Since,说明资源无新修改,则相应HTTP 304,告知浏览器继续使用保存的cache。

2)、Etag、if-None-Match
服务器相应请求时,告诉浏览器当前资源在服务器的唯一标识(生成规则由服务器决定),再次请求服务器时,通过此字段通知服务器客户端缓存数据的唯一标识。如果服务器收到请求后发现有头If-none-Match则与被请求资源的唯一标识进行比对,不同则说明资源被改动过,则响应整片资源内容,返回状态码200;
相同,说明资源无新修改,则相应HTTP 304,告知浏览器继续使用所保存的cache。

总结:

1)、强缓存:服务器通知浏览器一个缓存时间,在缓存时间内容下次请求直接使用缓存,不在时间内,执行协商缓存。
2)、协商缓存:将缓存信息中的Etag和Last-Modified通过请求发送给服务器,由服务器校验,返回304状态码时,浏览器直接使用缓存。

参考博客