关于HTML中meta标签的文档缓存有效期控制_通过pragma及cache-control

<meta http-equiv="Pragma">和<meta http-equiv="Cache-Control">在所有现代浏览器中均无效，因Chrome/Firefox/Safari/Edge自2010年代起已移除对其解析；可靠缓存控制必须通过服务端HTTP响应头实现。

别用 <meta http-equiv="Pragma"> 控制缓存 —— 它在 Chrome、Firefox、Safari、Edge 所有现代版本里完全不生效。 你加了也没用，浏览器压根不读；<meta http-equiv="Cache-Control"> 同样无效，不是写法错，是浏览器早就移除了对它的解析逻辑。

为什么 <meta http-equiv="Pragma"> 和 <meta http-equiv="Cache-Control"> 都失效了

这不是兼容性问题，而是设计取舍：

• Chrome/Firefox/Safari 自 2010 年代起已彻底移除对 http-equiv 缓存指令的解析，只保留 Content-Type、Refresh 等极少数支持
• http-equiv 本质是“模拟 HTTP 头”，但真实响应头具有绝对优先级 —— 服务端返回 Cache-Control: public, max-age=3600，哪怕你写十行 no-cache meta，浏览器也只认服务端那个
• 本地用 file:// 打开 HTML 时，根本没 HTTP 头，此时 meta 更是彻底无意义（常被误当作“它本来能工作”）
• W3C 规范从未要求浏览器支持 Pragma 的 meta 形式，主流实现也明确忽略

真正起效的缓存控制必须走 HTTP 响应头

所有可靠控制，都得靠服务端发出来的响应头：

• Nginx 配置：add_header Cache-Control "no-store";（推荐）或 "no-cache, must-revalidate"
• PHP 中必须在任何输出前调用：header("Cache-Control: no-store");，否则会因 headers already sent 报错
• Apache 可通过 .htaccess 设置：Header set Cache-Control "no-store"
• 如果必须兼容 IE6–8（极少数遗留场景），可加 Expires: 0 + Cache-Control: no-cache 响应头，但依然不要碰 Pragma meta

用户点「后退」按钮仍看到旧页面？那不是 HTTP 缓存的问题

即使你把所有响应头设成 no-store，用户按后退键仍可能看到 stale 内容 —— 这是浏览器的 bfcache（back/forward cache），和 HTTP 缓存无关：

立即学习“前端免费学习笔记（深入）”；

• bfcache 是为了提升导航性能而保存整个页面状态，绕过所有缓存控制头
• 若页面含敏感数据（如登录后跳转页），需监听 pageshow 事件：if (event.persisted) location.reload();
• 也可在关键页面响应头中加 Cache-Control: no-store, no-cache + Clear-Site-Data（部分浏览器支持）

最常被忽略的一点：缓存策略是否生效，唯一可信依据是 DevTools Network 面板里 Response Headers 的实际值，而不是你写了什么 meta 标签。