Question

我刚刚阅读了一篇有关如何使您成为使用axios HERE进行API请求DRY的CSS技巧的文章。现在做出这样的反应会很好：

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

如果我想向此实例传递其他参数，那该怎么办？即我有另一个我想要的标题参数：

'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 })呢？

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

2 个答案: