axios 发送uilts工具类可以自定义请求头 和 超时时间
时间: 2023-11-08 20:33:20 浏览: 38
是的,Axios 允许我们自定义请求头和超时时间。我们可以在创建 Axios 实例时传递一个配置对象,其中可以包含一个 `headers` 属性和一个 `timeout` 属性。
以下是一个示例,展示了如何自定义请求头和超时时间:
```javascript
import axios from 'axios';
// 创建一个 Axios 实例
const instance = axios.create({
baseURL: 'http://api.example.com',
timeout: 10000, // 请求超时时间
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer xxxxxxxx' // 自定义请求头
}
});
// 定义一个请求方法
export function request(method, url, data) {
return instance({
method: method,
url: url,
data: data
});
}
// GET 请求方法
export function get(url, params) {
return request('get', url, { params: params });
}
// POST 请求方法
export function post(url, data) {
return request('post', url, data);
}
```
在上面的示例中,我们在创建 Axios 实例时,传递了一个配置对象,其中包含了一个 `headers` 属性和一个 `timeout` 属性。我们可以在 `headers` 属性中自定义请求头,在 `timeout` 属性中设置请求超时时间。然后在 `request`、`get`、`post` 方法中使用这个 Axios 实例发送请求。
例如,我们可以在发送请求时,自定义一个 Authorization 请求头:
```javascript
import { get } from './axios-utils';
// GET 请求示例
get('/users', { page: 1 }, {
headers: {
'Authorization': 'Bearer yyyyyyyy'
}
}).then(response => {
console.log(response.data);
}).catch(error => {
console.log(error);
});
```
在上面的示例中,我们在调用 `get` 方法时,传递了一个配置对象,其中包含了一个 `headers` 属性,该属性包含了一个自定义的 Authorization 请求头。这样发送请求时,就会使用这个自定义的请求头。