为什么两段调用远程API的Axios JavaScript代码块行为不一致？

核心是axios.get()别名方法和通用axios()调用的参数解析规则不同，导致认证信息没有被正确放到请求头中：

• axios.get(url[, config])的第二个参数要求传入完整的配置对象，你直接把headers对象作为第二个参数传入时，axios不会把它识别为配置下的headers字段，而是会把整个headers对象直接当作config处理。相当于你传入的配置是{ ...你的headers对象 }，而不是预期的{ headers: 你的headers对象 }，最终请求头里没有携带认证信息，自然返回401状态码。
• 通用axios(config)调用要求传入完整配置对象，你把请求方法、url、headers都放到配置的对应字段下，axios可以正常解析到headers里的认证信息，请求符合接口要求就返回200状态码。

两种写法的对比示例：

// 错误的axios.get写法（返回401）
const headers = { Authorization: 'Bearer 你的token' }
axios.get('https://api.example.com/xxx', headers)
// 实际发出的请求头没有Authorization字段

// 正确的axios.get写法
const headers = { Authorization: 'Bearer 你的token' }
axios.get('https://api.example.com/xxx', { headers: headers })
// 第二个参数传入完整配置对象，headers放在配置的headers字段下

// 正常的通用axios调用写法（返回200）
const options = {
  method: 'get',
  url: 'https://api.example.com/xxx',
  headers: { Authorization: 'Bearer 你的token' }
}
axios(options)
// 所有参数都在对应字段下，解析正常

本质上是axios方法重载的参数匹配规则导致的问题，别名方法（get/post/put/delete等）的传参顺序和通用调用的传参结构不同，直接传headers会导致参数解析错位，请求头缺失必要的认证信息。

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