如何将动态参数传递给axios实例

Question

我刚刚阅读了一篇关于如何使用 axios HERE 使您的 API 请求 DRY 的 css-tricks 文章。现在做出这样的反应就可以了：

export default axios.create({
  baseURL: 'https://mysite/v3',
  headers: {
    'content-type': 'application/json'
  }
})

如果我想向这个实例传递额外的参数怎么办？ IE。我有另一个参数，我想像这样的标题：

'X-USER-ACCESS-TOKEN': sessionToken,

如果我有多个其他选项要传递给标题怎么办？

Answer 1

要动态传递headers，您可以导出一个以options 作为参数并返回axios 的新实例的函数：

// utils/custom-axios.js

export default function(options = {}) {
  const { 
    headers = {} 
  } = options;
  
  return axios.create({
    baseURL: "https://mysite/v3",
    headers: {
      "Content-Type": "application/json",
      ...headers
    }
  });
}

那么你可以通过以下方式使用它：

const axios = require("./utils/custom-axios");

const options = { 
  headers: { "X-USER-ACCESS-TOKEN": "secret" } 
};

axios(options)
  .post("./user.json", formData)
  .then(...)
  .catch(...);

// alternatively, don't pass any options 
axios()
  .post("./user.json", formData)
  .then(...)
  .catch(...);

Answer 2

如果我说得对，您想传递不同调用的标头，而不是使用基本配置为所有请求设置它们？

axios.get('url', { headers: 'X-USER-ACCESS-TOKEN': sessionToken }) 呢？