Axios设置请求头

以下是一篇关于如何使用 Axios 库设置请求头的教程。请求头（HTTP Headers）是 HTTP 请求的重要组成部分，它们包含了客户端传递给服务器的各种元数据，如认证信息、内容类型等。

设置请求头

在 Axios 中，你可以通过传递一个配置对象来设置请求头。这个配置对象可以包含多个属性，其中 headers 属性用于定义请求头。

示例：发送 GET 请求并设置请求头

axios.get('https://example.com/api/resource', {
    headers: {
        'Custom-Header': 'CustomHeaderValue',
        'Authorization': 'Bearer YOUR_ACCESS_TOKEN'
    }
})
.then(response => {
    console.log('Response data:', response.data);
})
.catch(error => {
    console.error('Error fetching resource:', error);
});

在这个例子中，我们向 https://example.com/api/resource 发送了一个 GET 请求，并设置了两个自定义的请求头：Custom-Header 和 Authorization。

示例：发送 POST 请求并设置请求头及请求体

axios.post('https://example.com/api/resource', {
    key1: 'value1',
    key2: 'value2'
}, {
    headers: {
        'Content-Type': 'application/json',
        'Authorization': 'Bearer YOUR_ACCESS_TOKEN'
    }
})
.then(response => {
    console.log('Resource created successfully:', response.data);
})
.catch(error => {
    console.error('Error creating resource:', error);
});

在这个例子中，我们向 https://example.com/api/resource 发送了一个 POST 请求，并设置了请求头以及请求体。注意，当发送 JSON 数据时，我们通常需要设置 Content-Type 为 application/json。

使用默认请求头

如果你需要在多个请求中使用相同的请求头，你可以设置 Axios 实例的默认请求头。

const instance = axios.create({
    baseURL: 'https://example.com/api',
    headers: {'Authorization': 'Bearer YOUR_ACCESS_TOKEN'}
});

// 使用创建的实例发送请求
instance.get('/resource')
.then(response => {
    console.log('Response data:', response.data);
})
.catch(error => {
    console.error('Error fetching resource:', error);
});

在这个例子中，我们创建了一个 Axios 实例，并设置了默认的 baseURL 和 Authorization 请求头。之后，我们可以使用这个实例来发送请求，而无需在每个请求中重复设置这些请求头。

总结

设置请求头是 HTTP 请求中的常见需求，Axios 提供了灵活的方式来定义和管理请求头。你可以在每个请求中单独设置请求头，也可以使用 Axios 实例来设置默认的请求头。

本文地址：https://www.tides.cn/p_js-axios-set-headers