应禁用<meta http-equiv="refresh">做生产环境跳转，因其不可控、易循环、SEO降权且被现代浏览器拦截；真要跳转应优先用location.replace()等JS方案，仅老旧内网等极端场景可谨慎作保底。
别用 <meta http-equiv="refresh"> 做生产环境的自动跳转——它不可控、易循环、SEO 降权，且现代浏览器（Chrome 93+、Safari PWA）会静默拦截无用户交互的跳转。
为什么 <meta http-equiv="refresh"> 在跳转场景下大概率出问题
这个标签不是重定向，而是让浏览器“放弃当前页、重新加载新 URL”，它不走 HTTP 状态码，也不触发 beforeunload，更不会等你表单填完。常见失效或异常包括：
- 用户刚打开页面，3 秒后强制跳走，输入中的内容全丢
- 写成
content="3; url=/login"（分号后带空格），旧版 Android WebView 或 IE11 直接忽略 - 目标页也写了同类
meta，A→B→A 形成死循环，浏览器不报错、不提示 - Chrome 110+ 对
content="0;url=..."报Refresh is blocked due to user gesture requirement - 搜索引擎识别到秒数 ≤ 1，可能视作 cloaking 降权
content 值的写法陷阱：空格、分号、URL 编码一个都不能错
浏览器对 content 的解析极其机械，必须严格匹配格式："秒数;url=目标地址"，中间不能有空格，url= 不能省略，中文/空格必须编码：
- ✅ 正确：
content="2;url=/dashboard"、content="0.5;url=https://a.com/search%3Fq%3Dhello%20world" - ❌ 错误：
content="2; url=/dashboard"（分号后空格）、content="2,url=/dashboard"（逗号）、content="2; /dashboard"（漏url=） - ⚠️ 相对路径以 HTML 文件所在路径为基准：若
index.html在/app/下，url=./about.html解析为/app/about.html，不是根目录
真要上线，JS 跳转才是可控解法
用 setTimeout + location.replace() 可规避历史栈污染、支持条件判断、能响应用户行为：
<script>
// 登录成功后跳转，且避免返回时回到空白跳转页
if (localStorage.getItem("token")) {
setTimeout(() => location.replace("/home"), 2000);
}
</script>
-
location.href：保留原页在 history 中，适合“稍后跳转”提示 -
location.replace()：替换当前记录，用户点「返回」不会回到跳转页，适合登录/支付完成页 - 可加防重逻辑：
let redirected = false; if (!redirected) { redirected = true; location.replace(...); } - 若需兜底 JS 失效场景，可在
<head>放一行保底<meta http-equiv="refresh" content="5;url=/fallback">，但仅作 fallback，不主用
SPA 和企业内网是两个极端，处理方式完全不同
单页应用里混用 meta refresh 极其危险——它会销毁整个 React/Vue 实例，绕过路由守卫，导致状态丢失、样式错乱；而某些政务内网终端（如锁定 IE11）又禁用 JS，此时 meta 是唯一选择：
- SPA 场景：彻底禁用
meta http-equiv="refresh"，所有跳转走前端路由（router.push()）或location.replace() - 老旧内网场景：只用于静态维护页或 URL 别名页，且确保跳转目标页不含同类型
meta，避免循环 - 共存时注意顺序：JS 代码必须早于
meta标签执行（比如放在<head>里），否则meta可能先触发
最常被忽略的一点：它从 HTML 开始解析就倒计时，和用户是否看到页面、是否正在输入完全无关。所谓“定时”，只是浏览器单方面决定的时间点，不是你页面的业务时间点。
