使用Axios发起GET请求遇401认证错误，仅curl请求后正常

可能的原因 #

• 跨域请求的Cookie携带限制：浏览器默认不会在跨域请求中携带服务器设置的Cookie，而curl会自动保存并发送Cookie。当你用curl成功请求后，服务器可能返回了认证会话Cookie，后续浏览器请求自动带上这个Cookie才通过了认证，而第一次Axios请求因为没带Cookie触发401。
• CORS预检请求的处理差异：浏览器会对跨域请求发送OPTIONS预检请求，若预检请求未正确携带Authorization头，服务器会拒绝后续请求；而curl不会触发预检请求，直接发送GET请求即可通过。

解决步骤 #

1. 开启Axios跨域凭证携带
   在Axios请求配置中添加withCredentials: true，让浏览器在跨域请求中自动携带服务器设置的Cookie：

   const response = await axios.get(
     `https://covalenthq.com/api/v1/${chainId}/address/${address}/balances_v2/`,
     {
       headers: {
         'Authorization': 'Basic ' + btoa(authString),
       },
       withCredentials: true // 开启跨域凭证携带
     }
   );
   

2. 确认Auth字符串格式
   Covalent API的Basic Auth要求格式为你的API_KEY:（用户名是API Key，密码留空，必须带冒号），再次检查authString是否符合：

   const authString = `${你的API_KEY}:`;
   

3. 排查预检请求问题
   打开浏览器开发者工具（F12）的Network面板，查看OPTIONS预检请求的状态和响应头：

   • 确认请求头中是否包含Authorization
   • 确认服务器响应头是否包含Access-Control-Allow-Origin（匹配你的域名）和Access-Control-Allow-Headers（包含Authorization）

补充说明 #

curl和浏览器的请求环境存在核心差异：curl不受浏览器CORS策略限制，且默认处理Cookie；而浏览器严格遵循跨域规则，默认不携带跨域Cookie，还会触发预检请求。这就是为什么curl成功后，浏览器请求能复用会话Cookie正常工作的原因。

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