现代浏览器完全不执行,其对缓存行为零影响;缓存策略由服务器响应头决定,且在HTML解析前已完成,DevTools中看到的Cache-Control值100%来自服务端。

现代浏览器完全不执行 meta http-equiv="Cache-Control" ——它对实际缓存行为零影响,写了也白写。
Chrome/Firefox/Safari/Edge 都已移除解析逻辑
从 Chrome 90、Firefox 80、Safari 15+ 开始,浏览器在 HTML 解析阶段直接跳过 http-equiv="Cache-Control"。缓存策略在 HTTP 请求响应完成时就已锁定,此时 HTML 还没开始下载,更别说解析 meta 标签了。
- 你在 DevTools 的 Network → Headers → Response Headers 里看到的
Cache-Control值,100% 来自服务器,和meta无关 - 即使把
<meta http-equiv="Cache-Control" content="no-cache">放在最开头,也无效 -
file://协议下连 HTTP 头都没有,meta更不可能起作用——但很多人误以为“本地测试能生效”
为什么你总在 DevTools 里看到“Cache-Control”字段?
因为那个字段只反映服务器响应头,不是浏览器读取 meta 后动态生成的。HTTP 缓存决策发生在网络层,远早于 HTML 解析器启动。
- 如果 Status 显示
200 from disk cache或304 Not Modified,说明缓存行为由服务端头决定 - 开发者常花时间调
meta写法,却没检查 Nginx / CDN 是否返回了Cache-Control: public, max-age=3600——那才是问题源头 - 用 curl -I 或浏览器 Network 面板确认真实响应头,别信刷新、别信 F5、别信“我改了 HTML 所以肯定生效了”
真正还有效的 http-equiv 值有哪些?
不是所有 http-equiv 都被废弃,但缓存相关的基本全退场了:
立即学习“前端免费学习笔记(深入)”;
-
Content-Type:仍有效,仅用于声明字符集,如content="text/html; charset=utf-8";错写成encoding会导致乱码 -
refresh:仍被支持,如content="3;url=/done",但语义弱、SEO 不友好,建议优先用location.replace() -
Content-Security-Policy:Firefox 等部分浏览器支持,但行为不统一,生产环境必须走响应头 -
Pragma、Expires、Set-Cookie、Location:全部不被主流浏览器支持,写了等于没写
最容易被忽略的是:缓存控制必须从服务端发起。Nginx 加 add_header Cache-Control "public, max-age=3600",Express 用 res.set('Cache-Control', 'public, max-age=3600'),PHP 调 header("Cache-Control: public, max-age=3600") ——这些才真正起效。



















