Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。
1、axios的配置 (config.js)
import axios from 'axios';
// let apiBaseUrl = process.env.BASE_API_URL
const instance = axios.create({
timeout: 30000,
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
},
withCredentials: true // 允许携带cookie
});
// instance.defaults.headers.get['Content-Type'] = 'application/json';
instance.interceptors.request.use(function (config) {
return config;
}, function (error) {
return Promise.reject(error);
});
// Add a response interceptor
instance.interceptors.response.use(function (response) {
// 登录判断
return response;
}, function (error) {
return Promise.reject(error);
});
export default instance;
2、axios的接口快捷定义
import instance from './httpConfig';
import qs from 'qs';
let apiBaseUrl = '//xxx.xxx.com';
export const httpPost = function (url, params, succBack, failBack, errBack) {
const httpUrl = apiBaseUrl + '/adminXMKPT' + url;
return instance.post(httpUrl, qs.stringify(params)).then(res => {
if (res.data && res.data.code === 0) {
if (succBack) { succBack(res.data) }
} else if (res.data && res.data.code && res.data.code === 12) {
// 清除token
const _this = window.top.myMainVue;
// 弹提示说未登录?
if (failBack) { failBack(res.data) }
if (_this) {
_this.$router.push({ path: '/login', query: {redirect: _this.$route.fullPath }});
} else {
window.top.location.href = '/#/login';
}
} else {
if (failBack) {
failBack(res.data);
}
}
}, err => {
if (errBack) { errBack(err) }
})
};
export const httpGet = function (url, params, succBack, failBack, errBack) {
const httpUrl = apiBaseUrl + '/adminXMKPT' + url;
return instance.get(httpUrl, {params: params}).then(res => {
if (res.data && res.data.code === 0) {
if (succBack) { succBack(res.data) }
} else if (res.data && res.data.code && res.data.code === 12) {
// 清除token
const _this = window.top.myMainVue;
// 弹提示说未登录?
if (failBack) { failBack(res.data) }
if (_this) {
_this.$router.push({ path: '/login', query: {redirect: _this.$route.fullPath }});
} else {
window.top.location.href = '/#/login';
}
} else {
if (failBack) {
let obj = res.data;
failBack(obj);
}
}
}).catch(error => {
if (errBack) { errBack(error) }
});
}
export const httpUpdate = function (url, params, succBack, failBack, errBack) {
const httpUrl = apiBaseUrl + '/adminXMKPT' + url;
let newParams = qs.stringify(params);
return instance.patch(httpUrl, newParams).then(res => {
if (res.data && res.data.code === 0) {
if (succBack) { succBack(res.data) }
} else if (res.data && res.data.code && res.data.code === 12) {
// 清除token
const _this = window.top.myMainVue;
// 弹提示说未登录?
if (failBack) { failBack(res.data) }
if (_this) {
_this.$router.push({ path: '/login', query: {redirect: _this.$route.fullPath }});
} else {
window.top.location.href = '/#/login';
}
} else {
if (failBack) {
let obj = res.data;
failBack(obj);
}
}
}, err => {
if (errBack) { errBack(err) }
})
}
export const httpDelete = function (url, params, succBack, failBack, errBack) {
const httpUrl = apiBaseUrl + '/adminXMKPT' + url;
return instance.delete(httpUrl, params).then(res => {
if (res.data && res.data.code === 0) {
if (succBack) { succBack(res.data) }
} else if (res.data && res.data.code && res.data.code === 12) {
// 清除token
const _this = window.top.myMainVue;
// 弹提示说未登录?
if (failBack) { failBack(res.data) }
if (_this) {
_this.$router.push({ path: '/login', query: {redirect: _this.$route.fullPath }});
} else {
window.top.location.href = '/#/login';
}
} else {
if (failBack) {
let obj = res.data;
failBack(obj);
}
}
}, err => {
if (errBack) { errBack(err) }
})
}
// 保存form data(包括上传文件)
export const httpFormPost = function (url, params, succBack, failBack, errBack) {
const httpUrl = apiBaseUrl + '/adminXMKPT' + url;
let config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
return instance.post(httpUrl, params, config).then(res => {
if (res.data && res.data.code === 0) {
if (succBack) { succBack(res.data) }
} else if (res.data && res.data.code && res.data.code === 12) {
// 清除token
const _this = window.top.myMainVue;
// 弹提示说未登录?
if (failBack) { failBack(res.data) }
if (_this) {
_this.$router.push({ path: '/login', query: {redirect: _this.$route.fullPath }});
} else {
window.top.location.href = '/#/login';
}
} else {
if (failBack) {
failBack(res.data);
}
}
}, err => {
if (errBack) { errBack(err) }
})
};