Axios iOS端Authorization Bearer请求头未发送问题求助

这个问题我之前也碰到过，核心原因是iOS 11.3.1版本的WebKit内核在处理XMLHttpRequest请求头时存在兼容性bug，再加上Axios全局默认头的设置逻辑在旧内核下的适配问题，导致Authorization头无法被正确附加。下面分点拆解原因和可行的解决方案：

可能的问题根源 #

• Axios全局默认头配置失效：window.axios.defaults.headers.common这种全局配置方式，在iOS 11.3.1的WebKit内核中可能无法被正确同步到每个请求上，哪怕你单独给单个请求手动设置头，也会受同样的内核问题影响。
• WebKit的请求头处理异常：这个版本的WebKit对自定义请求头的处理存在bug，无论是跨域还是同域请求，都可能自动丢弃Authorization这类自定义头，或者在预请求（OPTIONS）中没有正确携带头信息，最终导致服务器返回401。

可行的解决方案 #

1. 用Axios请求拦截器替代全局默认头设置 #

拦截器会在每个请求发起前动态注入请求头，比全局默认配置更可靠，能绕过旧WebKit的bug。代码示例：

// 替换原来的全局头设置，改用请求拦截器
axios.interceptors.request.use(function(config) {
  const accessToken = localStorage.getItem('access_token');
  if (accessToken) {
    // 直接给当前请求的headers赋值
    config.headers.Authorization = `Bearer ${accessToken}`;
  }
  return config;
}, function(error) {
  return Promise.reject(error);
});

2. 用原生XMLHttpRequest测试（排除Axios的问题） #

如果拦截器还是无效，试试用原生XHR直接设置请求头，确认是WebKit的问题还是Axios的问题：

const xhr = new XMLHttpRequest();
xhr.open('GET', '你的API地址', true);
xhr.setRequestHeader('Authorization', `Bearer ${localStorage.getItem('access_token')}`);
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4) {
    console.log('响应状态:', xhr.status);
    console.log('响应内容:', xhr.responseText);
  }
};
xhr.send();

如果原生XHR也无法携带头，那就是iOS 11.3.1的WebKit内核本身的问题，可以考虑临时方案：比如通过URL参数传递token（注意仅限低敏感接口，避免安全风险），或者服务器端针对iOS 11.3.1的请求做兼容处理。

3. 调整Axios版本 #

如果你的Axios版本比较新（比如0.22+），这类版本可能已经不再兼容iOS 11这类旧系统。可以尝试降级到Axios 0.21.x版本，这个版本对旧WebKit的兼容性更好：

# 降级到0.21.4（稳定兼容旧iOS的版本）
npm install axios@0.21.4 --save

4. 检查跨域请求的服务器配置 #

如果是跨域场景，确保服务器对OPTIONS预请求的响应中包含Access-Control-Allow-Headers: Authorization，否则iOS 11.3.1的WebKit会拒绝发送带Authorization头的实际请求。

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