
正文
vue项目 axios封装第二弹
提示:扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
import axios from "axios";
import qs from "qs";import { Message, MessageBox } from "element-ui";// 创建axios实例
const service = axios.create({
withCredentials: true,
// baseURL: '/api', // api的base_url
timeout: 10000 // 请求超时时间
});
// request拦截器
service.interceptors.request.use(
config => {
config.data && (config.data = qs.stringify(config.data));
// 请求头部带上token
localStorage.getItem("mskj_token") &&
(config.headers.Authorization = `token ${localStorage.getItem(
"mskj_token"
)}`);
return config;
},
error => {
return Promise.reject(error);
}
);
// respone拦截器
service.interceptors.response.use(
response => {
// 如果code不存在则返回正确数据 code存在则是各种失败状态
if (!response.data.code || response.data.code == 200) {
return response;
} else {
// code存在 错误提示
if (response.data.code == 401) {
MessageBox.confirm("你已离线", "确定登出", {
confirmButtonText: "重新登录",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
localStorage.removeItem("mskj_token");
location.reload(); // 重新实例化vue-router对象 避免bug
});
} else if (response.data.code == 400) {
// 登录失败
Message.error("账号或密码错误");
return false;
} else {
Message.error(
`发生了错误:${response.data.code} - ${
response.data.message
}`
);
return false;
}
}
},
error => {
Message({
message: `发生了错误:${error.response.status}
-
${error.response.statusText}`,
type: "error",
duration: 1.5 * 1000
});
return Promise.reject(error.response); // 返回接口返回的错误信息
}
);export default service;
使用
import axios from "common/js/http";
import { globalApi } from "common/global";// 登录
export function login(data) {
return axios.post(`${globalApi}/user/login`, data).then(res => {
return Promise.resolve(res);
});
}







