axios本身功能已经很强大了,封装也无需过度,只要能满足自己项目的需求即可。
常规axios封装,只需要设置:
- 实现请求拦截
- 实现响应拦截
- 常见错误信息处理
- 请求头设置
import axios from 'axios';
// 创建axios实例
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // api的base_url
timeout: 5000 // 请求超时时间
});
// 请求拦截器
service.interceptors.request.use(
config => {
// 可以在这里添加请求头等信息
// 例如:config.headers['Authorization'] = 'your token';
// config.data = qs.stringify(config.data); // 序列化,比如表单数据
return config;
},
error => {
// 请求错误处理
return Promise.reject(error);
}
);
// 响应拦截器
service.interceptors.response.use(
response => {
// 对响应数据做处理,例如只返回data部分
const res = response.data;
// 如果返回的状态码为200,说明成功,可以直接返回数据
if (res.code === 200) {
return res;