Axios 二次封装详解
//引用axios实例
import axios from 'axios';
//引入配置
import config from '../api/confing';
//引入弹窗
import { ElMessage }from 'element-plus';
//引入路由，主要用于跳转
import router from '../router';
//引入缓存，主要用于token处理
import storage from './storage';
const TOKEN_INVALID = 'Token 认证失败,请重新登陆!';
const NETWORK_ERROR = '网络请求异常,请稍后重试!';
// 创建 axios 实例对象,添加全局配置
const service = axios.create({
baseURL: config.baseApi,
timeout: 8000
});
// 请求拦截
service.interceptors.request.use(
config => {
// 获取用户信息
var userinfo = storage.getItem("userInfo");
if (typeof(userinfo) == "undefined" || userinfo == '' || userinfo == null) {
} else {
config.headers['token'] = userinfo.token
}
return config
},
error => {
console.log(error); // for debug
return Promise.reject(error)
}
);
// 响应拦截
service.interceptors.response.use((res) => {
const { code, data, msg } = res.data;
// 示例判断代码
if (code === 1) {
return data
} else if (code === 40001 || code === 40003) {
ElMessage.error(msg);
setTimeout(() => {
router.push('login')
}, 150);
return Promise.reject(TOKEN_INVALID)
} else if (code == 0) {
ElMessage.error(msg);
// 处理特殊情况的数据
} else {
ElMessage.error(msg || NETWORK_ERROR);
return Promise.reject(msg || NETWORK_ERROR)
}
});
// 请求核心函数
function request(options) {
options.method = options.method || 'get';
if (options.method.toLowerCase() === 'get') {
options.params = options.data;
}
let isMock = config.mock;
if(typeof options.mock!= 'undefined'){
isMock = options.mock;
}
if (config.env == 'production') {
service.defaults.baseURL = config.mockApi
} else if (config.env === 'prod') {
service.defaults.baseURL = config.baseApi
} else {
service.defaults.baseURL = isMock? config.mockApi : config.baseApi
}
return service(options);
}
['get', 'post', 'delete', 'patch'].forEach((item) => {
request[item] = (url, data, options) => {
return request({
url,
data,
method: item,
...options
})
}
});
export default request;