现代浏览器中仅Content-Type、Refresh、Content-Security-Policy三个http-equiv值仍被解析并生效,Cache-Control、Expires、Pragma全部无效,真实缓存控制必须依赖服务端HTTP响应头。

http-equiv 不是缓存控制开关,也不是服务端头的替代品——它只是浏览器在解析 HTML 时,对少数几个响应头的“模拟执行”,且仅限 http:// 或 https:// 协议下生效。
哪些 http-equiv 值现在还真正起作用
主流浏览器(Chrome、Firefox、Safari)2026 年实测仅以下值被解析并产生实际效果:
-
Content-Type:仅当未使用<meta charset>时作为 fallback,如<meta http-equiv="Content-Type" content="text/html; charset=utf-8">;但推荐直接写<meta charset="utf-8">,更简洁、无歧义 -
Refresh:可触发跳转或重载,如<meta http-equiv="Refresh" content="3;url=/done.html">;注意 Chrome 80+ 已限制自动跳转(尤其含用户交互前),且 SEO 和无障碍支持差,建议改用window.location.replace() -
Content-Security-Policy:部分支持 nonce/hash,如<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'nonce-a1b2c3'">;但不如 HTTP 响应头稳定,不支持report-uri等高级字段
Cache-Control、Expires、Pragma 全部无效
这不是你写错了,而是浏览器早就不处理了:
-
<meta http-equiv="Cache-Control" content="no-cache">在任何现代浏览器中都不影响缓存行为;真实缓存策略只看服务器返回的Cache-Control响应头 -
Expires和Pragma已被 W3C 废弃,Safari/Firefox 自 2015 年起忽略,Chrome 从 2012 版本起移除解析逻辑 - 本地用
file://打开 HTML 时,http-equiv整体失效——因为根本没有 HTTP 协议上下文
为什么写了也没反应?常见误判点
开发者常把现象归因于 meta 写法,其实根本不在同一层:
- DevTools Network 面板里看到的
Cache-Control: public, max-age=3600,一定来自服务器,不是<meta>;右键“Copy as cURL”就能验证 - 页面刷新后仍走 disk cache,说明服务端头设了
max-age或public,和 meta 无关;硬刷新(Ctrl+Shift+R)跳过强缓存,但这不是前端可控的 - GitHub Pages / Netlify / Vercel 等静态托管平台无法改响应头?那
http-equiv同样救不了你——它从来就不是解决方案
真要绕过缓存,该怎么做
如果服务端头不可控,只能从资源引用层面干扰缓存机制:
立即学习“前端免费学习笔记(深入)”;
- 对 HTML 中的 JS/CSS 路径加哈希后缀:
app.f3a7b2.js,构建时生成新文件名,自然触发新请求 - 跳转链接加时间戳扰动:
window.location.href = "page.html?t=" + Date.now();避免Math.random(),防止单页内重复调用生成相同 URL - 开发阶段用浏览器隐身模式 + 禁用缓存(DevTools → Network → ✅ Disable cache),但这是调试手段,不能用于线上
http-equiv 场景非常窄,且和缓存完全无关。最容易被忽略的一点是:它的优先级永远低于服务端响应头,哪怕你把它放在 <head> 最开头,也晚于 TCP 层收到的第一个数据包里的头信息。



















