几乎无效，因现代浏览器仅认cache-control响应头，meta标签不发往服务器且被cdn/代理忽略；防缓存必须依赖nginx等服务端精确配置no-store等响应头组合。
meta 标签设 Pragma: no-cache 单独用根本防不住缓存——它只对 HTTP/1.0 旧代理有效，现代浏览器基本忽略它。真要防，得靠组合策略 + 服务端响应头，meta 只能当兜底。
为什么<meta http-equiv="Pragma" content="no-cache">几乎没用
HTTP/1.0 的 Pragma 是历史遗留字段，现代浏览器（Chrome/Firefox/Safari/Edge）在收到响应时，只认 Cache-Control；meta 模拟的 Pragma 更是连 HTTP 头都不是，只是 HTML 解析器的模拟行为，实际不发给服务器，也不影响网络层缓存。
- IE6 等古董浏览器可能响应它，但你大概率不兼容它们
- 所有中间代理（CDN、企业网关、负载均衡）完全无视
meta标签 - SPA 首屏白屏问题通常就出在
meta无效 + 服务端缓存了index.html
Nginx 配置 add_header 才是关键防线
必须在服务端针对 /index.html 路径单独加响应头，否则前端改多少 meta 都白搭。
- 用
location = /index.html { ... }精确匹配，避免被其他location块覆盖 - 必须写全三组头：
Cache-Control（HTTP/1.1）、Pragma（HTTP/1.0 兼容）、Expires（代理/网关依赖） - 别用
no-cache：它允许缓存但强制校验，校验慢或失败就会白屏；改用no-store - 检查
server块顶部有没有expires 1h这类全局指令——它会直接覆盖add_header
正确配置示例：
location = /index.html {
add_header Cache-Control "no-store, must-revalidate";
add_header Pragma "no-cache";
add_header Expires "0";
}
meta 标签只能补漏，且必须配全
如果无法改服务端（比如托管在 GitHub Pages、Vercel 静态托管），才靠 meta 尽量兜底。但它必须和 Cache-Control + Expires 一起写，缺一不可。
-
<meta http-equiv="Cache-Control" content="no-store, must-revalidate">是核心，no-store比no-cache严格 -
<meta http-equiv="Expires" content="0">必须写，某些老旧 iOS WebView 或内嵌浏览器只认这个 -
<meta http-equiv="Pragma" content="no-cache">单独存在意义极小，但配齐后心理上更稳一点 - 这些
meta必须放在最前面，不能被 JS 动态插入
容易被忽略的三个真实坑点
开发阶段常踩的不是逻辑错，而是环境细节：
-
index.html被 CDN 缓存了：哪怕 Nginx 配对了，CDN 仍可能返回旧版本，需手动 purge 或设置 CDN 缓存规则为 bypass - 本地开发用
file://协议打开：所有缓存头失效，meta也无效，必须走http://localhost - Vue/React 构建后
index.html被哈希文件名覆盖：Nginx 的location = /index.html匹配不到，得改成location ~* \.html$或确保构建产物路径一致
缓存问题从来不是单点失效，而是层层叠加。真正“彻底”防住，靠的是服务端头 + CDN 策略 + 构建流程配合，meta 只是最后一道薄薄的纸门。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
