Axios发起登录请求后响应无Authorization Header问题如何解决

首先确认你在浏览器网络面板看到的Authorization属于响应头分类，而非请求头分类，排除把请求自带的头误判为后端返回头的情况。

常见原因及对应解决方案 #

• 原因1：跨域场景下后端未配置Access-Control-Expose-Headers暴露字段
  默认CORS规则限制，前端JavaScript仅能访问6个默认简单响应头，Authorization不属于默认暴露范围，因此即使浏览器能捕获到该头，Axios也无法读取到该字段。

解决方法：后端登录接口响应头新增配置：

Access-Control-Expose-Headers: Authorization

以Express框架为例，配置参考：

const cors = require('cors')
app.use(cors({
  exposedHeaders: ['Authorization']
}))

• 原因2：前端取值时字段名大小写错误
  Axios会自动将所有响应头字段转换为全小写格式，使用驼峰格式Authorization无法匹配到对应值。

解决方法：调整取值代码为：

const authToken = response.headers.authorization

• 原因3：Axios响应拦截器过滤了头字段
  如果配置了全局Axios响应拦截器，检查拦截逻辑中是否对响应头做了裁剪、过滤操作，导致Authorization字段丢失。

验证方式 #

调整配置后先打印完整response.headers对象，确认Authorization字段已存在后再做后续token存储、挂载请求头等逻辑。

内容的提问来源于stack exchange，提问作者Teejaay