【每日一题】解释一下浏览器缓存机制,包括强缓存和协商缓存。

75 阅读2分钟

0cf44c5e87b84ff384855a21569ebfab_0.png

回答:

浏览器缓存机制是为了提高页面加载速度和减轻服务器压力而设计的。缓存机制分为强缓存和协商缓存两种。

  1. 强缓存:

    • 强缓存的目标是在一定的有效期内直接使用缓存,不发送请求到服务器。
    • 实现方式主要通过设置两个 HTTP 头:ExpiresCache-Control
    • Expires 是一个 HTTP/1.0 的头部字段,表示缓存的过期时间,是服务器返回的过期时间。但是,它的缺点是依赖于客户端和服务器的时间同步。
    • Cache-Control 是 HTTP/1.1 中更为常用的头部字段,可以指定缓存的最大有效时间,例如 max-age=3600 表示缓存有效时间为3600秒。
  2. 协商缓存:

    • 协商缓存的目标是在缓存过期后,通过与服务器进行协商,来判断是否需要重新获取资源。
    • 实现方式主要通过设置两个 HTTP 头:Last-ModifiedETag
    • Last-Modified 是服务器返回的资源的最后修改时间,客户端会在请求时发送 If-Modified-Since 头部,如果服务器认为资源在该时间后没有修改,则返回 304 Not Modified,客户端直接使用缓存。
    • ETag 是服务器生成的资源唯一标识,客户端会在请求时发送 If-None-Match 头部,如果服务器认为资源标识没有变化,则返回 304 Not Modified,客户端直接使用缓存。
  3. 缓存控制的比较优先级:

    • 如果同时设置了 ExpiresCache-ControlLast-ModifiedETag,浏览器会优先使用 Cache-ControlETag,因为它们更为灵活和准确。
  4. 常见的缓存状态码:

    • 200 OK:表示资源在服务器上发生了变化,需要重新获取。
    • 304 Not Modified:表示资源未发生变化,直接使用缓存。

注意:

  • 强缓存和协商缓存可以同时存在,浏览器在请求时会先检查强缓存,如果命中则直接使用缓存,否则进入协商缓存流程。
  • 缓存策略需要根据具体业务场景和资源特性来选择,合理配置缓存策略可以有效提升网页性能。

扫码_搜索联合传播样式-白色版.png