今日份学习打卡 -- 前端缓存

59 阅读2分钟

强缓存和协商缓存

强缓存

强缓存主要是通过http请求头中的Cache-Control和Expire两个字段控制,一般,我们会设置Cache-Control的值为“public, max-age=xxx”,表示在xxx秒内再次访问该资源,均使用本地的缓存,不再向服务器发起请求。(补充:除非强制刷新,即清缓存, 其中Cache-Control优先级比Expires高, Expires是http1.0下的标准字段)

  • 优点: 使用本地缓存、减少重复请求
  • 缺点: 更新新版本时、用户还在用旧的数据或者接口,导致无法看到最新的数据(ps: 若此时旧接口在新版本已经不存在、将会报错引起线上事故)
  • 拓展: 到了HTTP/1.1,Expire已经被Cache-Control替代,原因在于Expires控制缓存的原理是使用客户端的时间与服务端返回的时间做对比,那么如果客户端与服务端的时间因为某些原因(例如时区不同;客户端和服务端有一方的时间不准确)发生误差,那么强制缓存则会直接失效

Cache-Control是通过控制网页缓存

  • public:所有内容都将被缓存(客户端和代理服务器都可缓存)

  • private:所有内容只有客户端可以缓存,Cache-Control的默认取值

  • no-cache:客户端缓存内容,但是是否使用缓存则需要经过协商缓存来验证决定

  • no-store:所有内容都不会被缓存,即不使用强制缓存,也不使用协商缓存

  • max-age=xxx (xxx is numeric):缓存内容将在xxx秒后失效

协商缓存

协商缓存会在每次发起请求时向服务器验证本地缓存是否依旧有效,最终确定是否使用本地缓存 控制协商缓存的字段分别有:Last-Modified / If-Modified-Since和Etag / If-None-Match,其中Etag / If-None-Match的优先级比Last-Modified / If-Modified-Since高。

  • 优点:能够确保数据更新能受我们控制
  • 缺点:每次都向服务器请求、并没有减少访问次数