Axios 拦截器无法获取所有 Headers 信息,如何解决?

axios 拦截器无法获取所有 headers 信息,如何解决?

axios 拦截器获取 headers 信息受限的问题

在使用 axios 拦截器 axios.interceptors.response.use 获取响应头信息时,可能会遇到部分信息无法获取的情况。例如,以下代码仅打印出部分响应头数据:

axiosinstance.interceptors.response.use((res) => {
  console.log(res.headers);
});

实际上,接口返回了更多 headers,但部分数据无法获取,如 access-token 属性。

问题原因

出现这样的问题是由跨域引起的。当前端和后端跨域请求时,后端需要在响应头中返回一个 access-control-expose-headers,指定允许前端访问的 headers。如果没有设置该响应头,则前端将无法获取所有响应头信息。

解决方案

要解决此问题,需要在后端代码中设置 access-control-expose-headers 响应头。例如,在 node.js express 中可以这样设置:

res.header("Access-Control-Expose-Headers", "Access-Token");

设置好响应头后,前端即可通过 axios 拦截器获取所有响应头信息。

以上就是Axios 拦截器无法获取所有 Headers 信息,如何解决?的详细内容,更多请关注硕下网其它相关文章!