fetch 默认自动跟随302重定向(redirect: "follow"),返回最终响应;如需获取location头,须设redirect: "manual",但跨域时该头被浏览器屏蔽。

fetch 默认会自动跟随 302 重定向,你通常**不需要手动处理**跳转链接——浏览器会在底层自动请求重定向后的目标 URL,并把最终响应返回给你。
fetch 的 redirect 选项控制重定向行为
fetch 提供 redirect 配置项,有三个可选值:
- "follow"(默认):自动跟随重定向,最多 20 次,最终返回最后一次响应(即重定向终点的响应)
- "error":遇到 301/302/303/307/308 等重定向状态码时,直接 reject,抛出 TypeError
- "manual":不自动跳转,返回 302 响应本身(含 Location 头),由你自行决定是否发起下一次请求
想拿到 302 的跳转地址?用 manual 模式
如果你需要读取原始 302 响应中的 Location 头(比如做权限校验、记录跳转路径、或自己控制跳转逻辑),必须设 redirect: "manual":
Java开发手册规约集合,基于阿里巴巴Java开发手册(嵩山版)。 涵盖7大维度:编程规约、异常日志、单元测试、安全规约、MySQL数据库、工程结构、设计规约。 当用户需要:(1) 编写或审查Java代码 (2) 检查命名/代码规范 (3) 处理异常和日志 (4) 编写单元测试 (5) 安全编码 (6) 数据库设...
fetch('/login', { redirect: 'manual' })
.then(res => {
if (res.type === 'opaqueredirect') {
// 注意:在 manual 模式下,跨域 302 的 Location 头会被浏览器屏蔽(返回空字符串)
// 同源请求才能安全读取
console.log('跳转地址:', res.headers.get('Location')); // 如:"/dashboard"
return res;
}
return res.json();
});
⚠️ 注意:跨域 302 响应中,Location 头属于敏感信息,默认被浏览器过滤(返回 null),只有同源重定向才能可靠读取。
自动跟随时,如何知道发生了重定向?
默认 follow 模式下,fetch 不暴露中间跳转过程。但你可以通过以下方式间接判断:
- 检查响应的 url 属性是否与请求地址不同:
res.url !== originalUrl - 服务端在重定向响应中添加自定义 header(如
X-Redirected: true),客户端读取 - 后端改用 200 + JSON 返回跳转信息(如
{ redirect: "/new-path" }),前端自行跳转(更可控)
常见误区提醒
- 不要试图在 follow 模式下读取 302 的 Location 头——它已不可见,响应是最终目标页的内容
-
redirect: "manual" 下,跨域重定向的响应类型为
"opaqueredirect",且多数 headers 不可读,不能直接 .json() 或 .text() - 如果需要完整重定向链(如调试),浏览器 DevTools 的 Network 面板比 JS 更直观
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










