如何清除React Native中Axios基础认证的历史缓存凭据？

问题根源 #

iOS的NSURLSession会自动缓存HTTP基础认证的凭据，即便你在Axios中传入新的auth参数，系统仍会优先使用缓存的旧凭据，导致新认证信息无法生效。

解决办法 #

1. 手动构造Authorization头，绕过系统自动缓存 #

放弃使用Axios的auth配置项，直接在请求头中生成Authorization字段，让系统不会自动缓存凭据：

function post1(username, password) {
  // 生成Base64编码的认证字符串
  const authStr = btoa(`${username}:${password}`);
  
  axios.post(
    'https://....',
    {
      action: 'actionsecond '
    },
    {
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json',
        'Cache-Control': 'no-cache',
        'Authorization': `Basic ${authStr}` // 手动添加认证头
      },
      withCredentials: false
    }
  )
  .then(response => {
    console.log(response.status);
    console.log('data', response.data);
  })
  .catch(error => {
    console.log(error.response?.data || error);
    console.log("password", password);
  });
}

2. 清除iOS系统缓存的凭据 #

如果必须保留Axios的auth配置，可以通过原生代码清除NSURLCredentialStorage中的缓存。在React Native中可实现原生模块来完成：

• iOS端Objective-C代码：

#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>

@interface CredentialManager : NSObject <RCTBridgeModule>
@end

@implementation CredentialManager

RCT_EXPORT_MODULE();

RCT_EXPORT_METHOD(clearAuthCredentials) {
  NSURLCredentialStorage *storage = [NSURLCredentialStorage sharedCredentialStorage];
  NSDictionary *credentials = [storage allCredentials];
  
  for (NSURLProtectionSpace *space in credentials.allKeys) {
    NSDictionary *spaceCredentials = credentials[space];
    for (NSString *user in spaceCredentials.allKeys) {
      [storage removeCredential:spaceCredentials[user] forProtectionSpace:space];
    }
  }
}

@end

• React Native端调用：

import { NativeModules } from 'react-native';

// 切换用户前先清除缓存
NativeModules.CredentialManager.clearAuthCredentials().then(() => {
  // 再发送新的认证请求
  post1();
});

3. 添加唯一参数避免缓存（辅助方案） #

在请求URL后添加时间戳或随机参数，让每个请求都唯一，避免系统复用缓存：

const uniqueParam = `t=${Date.now()}`;
const url = `https://....?${uniqueParam}`;

axios.post(url, ...);

注意事项 #

• withCredentials: false无法阻止iOS系统缓存基础认证凭据，该配置主要控制跨域Cookie的发送逻辑，和基础认证缓存无关。
• 手动构造Authorization头是最直接的解决方式，无需依赖原生代码，适配多数场景。

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