前端开发中,缓存头主要通过 HTTP 响应头设置,用于控制浏览器以及中间代理服务器如何缓存响应内容。以下是一些常见的缓存头及其用处:
强缓存相关的头部:
-
Cache-Control
: 这是现代缓存控制的主要机制,功能强大且灵活,可以覆盖其他缓存头(例如Expires
)。一些常用的指令包括:public
:响应可被任何缓存存储,包括浏览器和代理服务器。private
:响应只能被单个用户缓存,不能被共享缓存(例如代理服务器)存储。no-cache
:强制浏览器每次都向服务器验证资源的新鲜度,即使本地有缓存副本。但这并不意味着不缓存,浏览器仍然会缓存资源,只是会先验证。no-store
:禁止任何缓存存储响应,每次都必须从服务器获取。max-age=<seconds>
:指定资源在缓存中有效的最长时间(以秒为单位)。s-maxage=<seconds>
:类似于max-age
,但仅适用于共享缓存(例如代理服务器)。immutable
:指示资源在有效期内不会更改,浏览器无需再次检查更新,即使按了刷新按钮。适用于版本化的静态资源。
-
Expires
: 指定资源的过期日期和时间。这是一个较旧的缓存控制机制,优先级低于Cache-Control
。如果同时存在Cache-Control: max-age
和Expires
,则max-age
优先。 由于Expires
使用绝对时间,如果客户端和服务器的时钟不同步,可能会导致问题。
协商缓存相关的头部:
-
Last-Modified
: 指定资源的最后修改时间。浏览器在下次请求时会带上If-Modified-Since
头部,服务器根据这个时间判断资源是否已修改。如果未修改,则返回 304 Not Modified 状态码,浏览器使用本地缓存。 -
ETag
: 资源的实体标签,是一个字符串,可以是文件内容的哈希值或版本号。浏览器在下次请求时会带上If-None-Match
头部,服务器根据 ETag 判断资源是否已修改。如果未修改,则返回 304 Not Modified 状态码,浏览器使用本地缓存。ETag
比Last-Modified
更精确,可以检测到文件的细微变化。 -
If-Modified-Since
: 请求头,浏览器发送,用于协商缓存,与Last-Modified
配合使用。 -
If-None-Match
: 请求头,浏览器发送,用于协商缓存,与ETag
配合使用。
其他相关的头部:
-
Pragma
:Pragma: no-cache
等同于Cache-Control: no-cache
。这是一个较旧的缓存控制机制,主要用于 HTTP/1.0,在 HTTP/1.1 中,Cache-Control
是首选的缓存控制机制。 -
Vary
: 指定哪些请求头字段会影响缓存匹配。例如,Vary: Accept-Encoding
表示缓存会根据Accept-Encoding
请求头区分不同版本的资源(例如 gzip 压缩版本和未压缩版本)。
缓存控制策略示例:
-
静态资源(例如图片、CSS、JavaScript 文件): 可以使用强缓存,设置较长的
max-age
,例如Cache-Control: public, max-age=31536000, immutable
(一年)。 -
经常更新的动态内容: 可以使用协商缓存,设置
Last-Modified
或ETag
。 -
不应缓存的内容(例如包含敏感信息的页面): 可以使用
Cache-Control: no-store, no-cache, must-revalidate
。
合理地使用缓存头可以显著提高网站的性能和用户体验,减少服务器负载和带宽消耗。 选择合适的缓存策略取决于具体资源的特性和更新频率。
标签:Control,缓存,浏览器,no,Cache,Modified,举例,用处 From: https://www.cnblogs.com/ai888/p/18571510