1)浏览器缓存

发布于 2022年 04月 11日 22:47

浏览器缓存有哪些?

  • 强缓存:当我们访问URL的时候,不会向服务器发送请求,直接从缓存中读取资源,但是会返回200的状态码
  • 协商缓存:
  • 缓存位置:Service Worker --> Memory Cache --> Disk Cache -->Push Cashe

1 强缓存

如何设置强缓存?

1) 当我们第一次进入页面,请求服务器, 浏览器会根据respone header来判断是否对资源进行缓存,如果响应头中存在expires,pragma或者cache-control字段,代表强缓存,会将资源缓存在memory cache或disk cache中。

2) 第二次请求时,浏览器判断请求参数,如果符合缓存条件直接返回状态码200,从本地缓存中拿数据。否则把响应参数存在request 请求头中看是否符合协商缓存,符合返回状态码304,不服合返回全新资源

相关请求头

  • expires:是http1.0控制网页缓存的字段,值是一个时间戳,格林尼治时间。缺点:判断是否过期是用本地时间来判断的

  • Cache-Contral:是http1.1 中控制网页缓存的字段,Cache-contral 优先级比较高

  1. private:浏览器可以缓存,中间代理服务器不能缓存
  2. no-cache:跳过当前的强缓存,发送http请求,直接进协商缓存阶段
  3. no-store:不进行任何形式的缓存
  4. s-maxage:和max-age很像,但是区别在与s-maxages是针对代理服务器的缓存时间

2协商缓存

什么是协商缓存?

  • last-modify/if-modify-since

1)浏览器第一次请求一个资源的时候,服务器返回的header中会加上Last-Modify,last-Modify是一个时间标识该资源的最后修改时时间,

2)浏览器再次请求该资源时,request的请求头中会包含if-modify-since,该值为缓存之前返回的Last-Modify。服务器收到if-modify-since后根据资源最后修改时间判断是否命中

  • ETag/if-None-Match

与last-Modify/if-Modify-Since不同的是,Etag/if-none-match返回的是一个校验码。Etag可以保证每一个资源是唯一的,资源的变化都会导致ETag变化。服务器根据浏览器上送的if-None-Match值来判断是否命中缓存

推荐文章