游览器缓存讲解

浏览器缓存是指浏览器在本地存储已经请求过的资源的一种机制,以便在将来的请求中能够更快地获取这些资源,减少对服务器的请求,提高页面加载速度。浏览器缓存主要涉及到两个方面:缓存控制和缓存位置。

缓存控制

Expires 头:

作用: 通过 Expires 头指定资源的过期时间,即资源在客户端缓存的有效期。

示例: Expires: Tue, 10 Nov 2023 12:00:00 GMT

Cache-Control 头:

作用: 提供更灵活的缓存控制,包括 public(可以被任何中间缓存和终端缓存)、private(只能被终端缓存)、no-cache(需要先验证是否过期)、max-age(指定缓存的最大有效时间)等。

示例: Cache-Control: max-age=3600, public

Last-Modified 头:

作用: 指定资源最后一次修改的时间。

示例: Last-Modified: Tue, 01 Nov 2022 08:00:00 GMT

If-Modified-Since 头:

作用: 客户端发送该头,用于条件性地请求服务器,仅在资源在指定时间后被修改时才会返回资源内容。

示例: If-Modified-Since: Tue, 01 Nov 2022 08:00:00 GMT

ETag 头:

作用: 提供一个唯一的标识符,当资源被修改时,ETag 会发生变化。

示例: ETag: "abc123"

If-None-Match 头:

作用: 客户端发送该头,用于条件性地请求服务器,仅在资源的 ETag 值与指定的值不匹配时才返回资源内容。

示例: If-None-Match: "abc123"

缓存位置

Memory Cache(内存缓存):

缓存在内存中,读取速度快,但容量较小,仅在浏览器打开时有效。

Disk Cache(磁盘缓存):

缓存在磁盘中,容量相对较大,可以在浏览器关闭后依然有效。

Service Worker Cache(Service Worker 缓存):

使用 Service Worker 技术,可以在离线状态下提供缓存服务,用于构建离线应用。

Push Cache:

用于存储通过 HTTP/2 服务器推送而来的资源。

缓存的流程

首次请求:

浏览器向服务器请求资源。

服务器响应:

服务器返回资源,并在响应头中设置相应的缓存控制信息。

浏览器缓存:

浏览器将资源保存在缓存中,同时记录缓存控制信息。

再次请求:

如果资源没有过期,浏览器直接从缓存中读取资源,不再请求服务器。

条件性请求:

如果资源过期或被修改,浏览器通过条件性请求(如 If-Modified-Since 或 If-None-Match)向服务器验证是否需要获取新的资源。

更新缓存:

如果服务器返回新的资源,浏览器将新的资源存储在缓存中,更新缓存控制信息。

通过合理设置缓存控制头,开发者可以更好地控制客户端缓存的行为,从而提升用户体验和加速页面加载。

相关推荐
直奔標竿5 小时前
Java开发者AI转型第二十七课!Spring AI 个人知识库实战(六)——全栈闭环收官,解锁前端流式渲染终极技巧
java·开发语言·前端·人工智能·后端·spring
虹科网络安全10 小时前
艾体宝新闻|Redis 月度更新速览:2026 年 3 月
数据库·redis·缓存
1892280486110 小时前
EMMC32G-TA28闪存EMMCH26M78103CCR
大数据·人工智能·缓存
空中海10 小时前
Spring Cloud 专家级面试题库
spring·spring cloud·面试
直奔標竿12 小时前
SpringAI + RAG + MCP + Agent 零基础全栈实战(完结篇)| 27课完整汇总,Java开发者AI转型必看
java·开发语言·人工智能·spring boot·后端·spring
云烟成雨TD12 小时前
Spring AI 1.x 系列【31】向量数据库:进阶使用指南
java·人工智能·spring
counting money13 小时前
Spring框架基础(依赖注入-全注解形式)
java·数据库·spring
counting money13 小时前
Spring框架基础(依赖注入-半注解形式)
java·后端·spring
IT界的老黄牛14 小时前
停电后 Redis 集群两节点起不来:fix 完还报 Bad file format?多部分 AOF 修复的正确姿势
运维·redis·缓存
sing~~16 小时前
SpringCloud的了解和使用
后端·spring·spring cloud