Axios：在 GET/POST 请求中设置标头

这篇快速直接的文章向您展示了如何在使用Axios发送 GET 和 POST 请求时设置标头。事不宜迟（比如谈论 Axios 是什么或闲聊它的历史），让我们开始吧。

在 GET 请求中设置标头

当调用axios.get() 方法执行 GET 请求时，我们在第二个参数（第一个参数是 URL）中传递我们的自定义headers对象，如下所示：

const res = await axios.get(
    'https://non-existing-api.kindacode.com/products',
    {
      headers: {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*',
        Authorization: 'Bearer YOUR_AUTH_TOKEN',
      },
    }
);

console.log(res.data);

选择：

const res = await axios('http://localhost:3000/api/v1/users', {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
    },
});

console.log(res.data);

在 POST 请求中设置标头

要发送带有自定义标头的 POST 请求，您可以调用axios.post() 方法，如下所示：

const res = await axios.post(
    'https://www.kindacode.com/fake-api/endpoint',
    {
      // request body data
      message: 'Hello KindaCode.com',
    },
    {
      headers: {
        'Content-Type': 'application/json',
        Authorization: 'Bearer 123456',
      },
    }
);

第一个参数是您的 API URL，第二个参数是您要发布的数据，第三个参数是选项对象。在第三个参数中设置标题。

选择：

const res = axios('https://www.kindacode.com/fake-api/endpoint', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      Authorization: 'Bearer 1234567890',
    }, 
    // request body
    data: {
      message: 'Hello World',
    },
});