使用 axios 拦截器拦截响应时无法获取某些响应头信息？

在使用 axios.interceptors.response.use 拦截响应时，你发现只能获取到部分响应头信息，而其他信息却无法获取，比如 Access-Token 属性。

这种情况通常发生在跨域请求中。当后端返回的响应头中没有包含 Access-Control-Expose-Headers 时，浏览器会出于安全考虑限制前端访问某些响应头信息。

Web Accessibility (WCAG 2 AA))

将 WCAG 2 AA 无障碍标准应用于设计系统、UI 组件和网页——通过可运行的验证器进行对比度计算，采用设计 token 模式使颜色天生可访问，设定排版和焦点状态规则，并提供语义检查清单。适用于构建或审查 UI。

下载

要解决此问题，需要在后端设置 Access-Control-Expose-Headers 响应头，指定允许前端访问的响应头字段。该字段的值为允许访问的响应头名称，多个响应头以逗号分隔。

设置 Access-Control-Expose-Headers 响应头后，就可以在前端拦截器中访问完整的响应头信息了。