主要分为两种:强缓存,协商缓存

  • 强缓存:浏览器请求资源时,通过Cache-ControlExpires响应头中的字段判断是否缓存命中,就从缓存中加载资源,不会向服务器发送请求
  • 协商缓存:当强缓存未命中时,通过请求头中的If-Modified-SinceIf-None-Match字段来判断资源是否发生变化
    • 如果资源未变化,服务器返回304 Not Modified状态码,浏览器继续使用缓存资源。
    • 如果资源已变化,服务器返回200 OK状态码和新资源。

实际使用场景

  • 图片、CSS、JavaScript 等静态资源: 可以使用强缓存,设置较长的 max-age 值。
  • HTML 文件: 通常使用协商缓存,确保用户总是获取到最新的页面内容。
  • API 接口: 可以根据 API 的特性选择合适的缓存策略。

reference

前端知识速记:浏览器缓存机制 - 强缓存与协商缓存