import axios from 'axios';//全局的属性
// axios.create创建一个新的请求实例instance
// instance用法跟axios的用法一样可以使用instance({})。instance.get() instance,post()
const instance = axios.create({
baseURL: process.env.VUE_APP_URL,
timeout: 5000
})
// 请求拦截器:在请求之前的数据处理,比如在请求头添加token,所有的请求都会经过请求拦截器
// 请求成功执行回调函数1,请求失败执行回调函数2
instance.interceptors.request.use(config => {
// 在请求头统一添加的token
return config
}, err => {
return Promise.reject(err);
});
// 响应拦截器:在请求响应之后对数据处理,比如:登录失败、请求数据失败的处理
// 响应成功执行回调函数1,请求失败执行回调函数2
instance.interceptors.response.use(response => {
// console.log('response: ', response);
return response.data;
}, err => {
return Promise.reject(err);
});
const callApi = (method = 'GET', url, data = {}) => {
return instance({
method,
url,
params: method === 'GET' ? data : {},
data: method === 'POST' ? data : {},
});
}
// 封装一个请求函数
export const getApi = (url, data) => callApi('GET', url, data)
export const postApi = (url, data) => callApi('POST', url, data)
// getApi('/api/RoomApi/live').then(res => {
// console.log('res: ', res.data);
// })
axios的二次封装,请求拦截器,请求拦截器
最新推荐文章于 2023-11-25 09:00:00 发布