Vue 3 响应拦截器无法处理浏览器自动执行的 HTTP 302/307 重定向，仅能拦截业务级跳转（如 200 响应中含 redirectUrl 字段）和认证失效（401/403）跳转，推荐后端统一返回 redirectUrl 字段而非依赖 302。
Vue 3 中响应拦截器本身不会自动处理服务端返回的 HTTP 302/307 重定向，因为浏览器在底层已接管并执行了跳转（Axios 拿不到中间响应），所以你通常收不到 302 响应体，自然也无法在拦截器里做逻辑判断或路由跳转。
真正能被拦截器捕获并处理的“重定向”其实是业务级跳转
这类跳转不是靠 HTTP 状态码，而是后端在正常响应（如 200）中主动返回一个跳转字段，比如：
{"code": 200, "data": {}, "redirectUrl": "/admin/dashboard"}
这时你可以在响应拦截器中解析该字段，再调用 Vue Router 跳转：
- 检查 response.data.redirectUrl 是否存在且为字符串
- 使用
router.push()或router.replace()执行跳转 - 建议加防重复跳转逻辑（如避免连续触发多次 push）
401/403 等认证失效场景下的跳转才是拦截器典型用法
当接口返回 401（未授权）时，说明 token 过期或无效，此时应在响应拦截器中跳转登录页，并携带当前路径用于登录后回跳：
- 从
useRoute()获取当前 fullPath - 拼接
/login?redirectUrl=xxx并编码（encodeURIComponent） - 调用
router.push()跳转
服务端返回 302 时前端要怎么做？
如果你确实需要让前端感知并干预 302 行为（比如统一记录跳转日志、拦截特定域名跳转等），有两条路可走：
Element Plus UI Vue3
下载
Element Plus Vue3 桌面组件库。在开发 Vue 3.x 页面时调用，使用 Element Plus 组件（如 el-button、el-input、el-form、el-table 等）。
-
禁用浏览器自动重定向：将 Axios 请求的
redirect选项设为'manual'，此时响应会返回 302 + Location 头，但需手动读取并跳转（注意跨域限制，Location 头可能被浏览器屏蔽） - 改用业务字段代替 302：更推荐。后端统一返回 200 + redirectUrl 字段，完全可控，无兼容性问题，也便于埋点和灰度控制
小结：拦截器不处理浏览器级重定向，只处理业务约定的跳转指令
别指望在 response 拦截器里 catch 到 302；重点放在对 401/403 的自动登出跳转，以及对后端返回的 redirectUrl 字段做解析跳转——这两类才是 Vue 3 + Axios 实际项目中最常用、最稳定的方式。
立即学习“前端免费学习笔记（深入）”；
