Axios库
Axios是一个基于Promise的HTTP客户端,支持浏览器和Node.js,提供了比Fetch更丰富的功能。
Axios优势
拦截器
请求和响应拦截,统一处理逻辑
请求取消
支持取消正在进行的请求
自动转换
自动转换请求和响应数据
错误处理
更详细的错误信息和状态码
实现示例
// 安装: npm install axios
import axios from 'axios';
// 创建实例
const apiClient = axios.create({
baseURL: 'https://api.example.com',
timeout: 10000,
});
// 请求拦截器
apiClient.interceptors.request.use(
config => {
config.headers.Authorization = `Bearer ${localStorage.getItem('token')}`;
return config;
},
error => {
return Promise.reject(error);
}
);
// GET请求
async function getUser(id) {
try {
const response = await apiClient.get(`/users/${id}`);
return response.data;
} catch (error) {
console.error('Error fetching user:', error);
}
}
// POST请求
async function createUser(userData) {
try {
const response = await apiClient.post('/users', userData);
return response.data;
} catch (error) {
console.error('Error creating user:', error);
}
}