一、浏览器缓存和http协议标头
1、缓存优点:
- 提高网页请求响应的速度
- 降低服务器带宽的占用
- 降低服务器的负载(主要指的是cpu 内存这些硬件资源)占用
- 提高用户的体验度
- 降低用户的焦虑
2、浏览器缓存是在用户的disk(磁盘)或者内存上面
3、浏览器的缓存原理
(1)当网页需要资源的时候,首先访问浏览器缓存,如果浏览器缓存没有数据时,那么就会请求服务器端,服务器进行响应数据,浏览器就会同时把数据资源存储起来,当网页再次需要这个资源的时候,还是先访问浏览器缓存,发现有数据就会直接返回。
(2)原理图:
4、浏览器缓存的五个概念
(1)浏览器:资源的请求方
(2)源服务器:就是后端服务器,真正资源的来源端,可以将内容缓存到任何的位置。
(3)新鲜度:就是缓存数据的时间周期。
(4)检验值:缓存过期之后,会继续请求服务端返回数据,将会对旧的缓存和新的数据内容做对比,如果数据没有变动,那么只需要更新缓存的过期时间,不需要更新缓存内容。
(5)缓存失效:就是缓存过期并且缓存的内容和新的内容存在不同时,就会将新的内容存储到缓存中。
二、http协议标头
浏览器和服务器之间主要的通讯方式是http协议,所有的缓存策略都是在http标头中,每当浏览器请求服务端时,服务都会在响应报文中设置一段标头。
1、新鲜度相关的标头:cache-control、pragma、expires。
- cache-control: private、public、no-store、no-cache、max-age、s-max-age、must-revalidate、proxy-revalidate (1)private:内容是对用户私有的,只能在浏览器中缓存,而不能在服务器中缓存 (2)public:表示可以在任何位置缓存 (3)no-store:表示不可以被任何人缓存 (4)no-cache:可以被缓存,但是需要内容进行校验 (5)max-age:表示缓存的过期时间,单位为秒。 (6)s-max-age:共享缓存的过期时间(代理服务器会使用这个时间) (7)must-revalidate:如果内容缓存有效期超过了cache-control的max-age时间,必须让请求服务器 (8)proxy-revalidate:跟must-revalidate相同,不过用于代理服务器。
- pragma:设置no-cache数据就不会被缓存
- expires:设置缓存期限
2、检验值相关的标头:etag(entity tag 实体标签)、last-modified、if-none-match、if-modify、if-modified-since
- ETag:资源的唯一标识符,缓存有效期过期后,再次请求服务器会附带请求头if-none-match,它的值就是上一次请求返回的ETag,然后服务器收到当前的请求后,会将它的值跟新的内容进行对比,如果不相同,返回新的ETag和新的资源数据,否则返回304状态码,表示没有发生任何变化。
- last-modified:表示资源上一次修改的时间
三、强缓存和协商缓存
在http中可以通过控制http响应头来控制http客户端的资源缓存,可分为两大类:强缓存和协商缓存
1、强缓存
强缓存是通过响应头的cache-control中的max-age等指令进行控制,max-age可设置强缓存的时间周期,在此周期内发送请求将直接从客户端缓存获取资源,而不会向服务器发送请求。
2、协商缓存
协商缓存可以通过响应头的ETag和last-modified进行控制,每次发送请求时,需要进行缓存新鲜度检验,如果资源过旧,那么直接从响应中获取新的资源返回状态码200 OK,否则从客户端缓存获取返回状态码304 Not Modified。新鲜度检验 通过请求头if-none-match(上一次请求的ETag)与响应头的ETag进行对比,或者请求头if-modified-since与响应头last-modified进行对比。
(1) if-none-match与ETag对比:每次发送请求就会携带上一次请求返回来的标识if-none-match发送到服务器,服务器进行校验标识,如果if-none-match跟服务器的ETag不相符合,那么就返回200状态码、最新的资源和新的资源标识。否则返回304状态码,从缓存中直接获取。
(2) if-modified-since与last-modified对比:每次发送请求的时候都会携带上一次内容更新的时间发送到服务器,服务器就会判断请求的资源有没有最新的修改,有就返回200状态码 OK并返回最新的更新时间和新的资源与标识,否则返回304状态码 Not Modified 直接从缓存拿数据。
(3) ETag和Last-Modified的区别
优先使用ETag
1、last-modified 的值只能精确到秒
2、文件如果每隔一段时间都会重复生成,但是内容相同。服务器就会检测到新的时间更新,last-modified都会每次返回200和新的资源文件与资源标识,即便内容相同。但ETag能判断出文件的内容相同,就会返回304,使用缓存。