LouisTsang-jk.github.io

缓存

因为浏览器和服务器之间的通信方式是应答模式，在浏览器第一次向服务器发起请求之后拿到请求结果，会根据响应报文中的 HTTP 头的缓存标识来决定是否需要缓存结果。 那缓存又分为强缓存和协商缓存.

机制

1. 当浏览器加载资源的时候会根据这个资源的 http header 判断是否命中强缓存，命中则直接从本地缓存中返回
2. 如果没有命中强缓存，则浏览器会发送一个请求到服务器，服务器根据 http header 验证这个资源是否命中协商缓存，如果命中则将这个请求返回，告诉浏览器可以直接从缓存中加载这个资源
3. 当强缓存和协商缓存都不命中的时候就直接从服务器加载资源数据

强缓存

通过设置 header 的 Expires 和 Cache-Control 来实现

• Expires
  表明缓存在指定时间内过期
• Cache-Control
  • max-age
    时间秒，是个相对时间
  • public
    客户端和代理服务器
  • private
    仅客户端、即 CDN 服务器不作用
  • no-cache
    使用前重新请求，强制进行协商请求
  • no-store
    禁用缓存

    一般协商缓存的请求都会提示是 from memory cache 或者 from disk cache，内存会优先，使用内存一般是刷新页面的情况，此时进行没有关闭。

---

协商缓存

强缓存失效后，浏览器携带缓存标识向服务器发起请求，由服务器根据缓存标识决定是否使用缓存的过程，如果协商缓存生效返回 304，不生效返回 200。 相关的缓存标识有两对，分别是

• Last-Modified
  返回该资源在服务器最后被修改的时间

• If-Modified-Since
  客户端发起请求的时候带上上一次返回的 Last-Modified 的值通过 If-Modified-Since，服务器收到之后根据该值与该资源在服务器最后被修改时间做对比，如果当前服务器资源最后修改时间大于 If-Modifed-Since 字段，则重新返回资源，并返回 200，反之则返回 304，告诉浏览器可以继续使用缓存资源

• Etag(优先级高)
  服务器对该资源的唯一标识
• If-None-Match
  客户端通过 If-None-Match 字段向服务器返回 Etag 的值，服务器将此与资源再次对比，有变更则返回新结果和 200，如果结果一致则返回 304。

启发式缓存

当既没有 max-age，也没有 exprires，浏览器会依然请求缓存内容，而不是请求服务器。他的策略机制是根据当前头的 Date 和 Last-Modified 的时间差值，取 10%作为缓存时间周期。