axios在vue中的配置
配置
import axios from 'axios';
// import Vue from 'vue';
import Cookies from 'js-cookie';
import utils from './utils';
const baseURL = process.env.baseUrl;
const http = axios.create({
baseURL, // api的base_url
timeout: 60000, // 请求超时时间
});
// request拦截器
http.interceptors.request.use((config) => {
// 在发送请求之前做些什么
const token = Cookies.get('token');
if (token) {
// 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
config.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
}
// 上传文件的时候,需要添加header
if (config.url.indexOf('fileUpload') > 0) {
if (config.method === 'post') {
// config.headers['Content-Type'] = 'multipart/form-data';
// config.headers['X-Requested-With'] = 'XMLHttpRequest';
}
}
return config;
}, (error) => {
// Do something with request error
// console.log(error);
Promise.reject(error);
});
// respone拦截器
http.interceptors.response.use(
(response) => {
if (response.data.code === 2001) {
// alert('登录信息失效,请重新登录');
utils.logout();
return Promise.reject(response);
}
if (response.data.code !== 1) {
// alert(response.data.msg);
return Promise.reject(response);
}
return response;
},
error => Promise.reject(error)
,
);
export default http;
使用(分模块)
api.js
import http from '配置文件'
export function xxx(){
return http({
url: '',
method:''
data:''
})
}
demo.vue
import { xxx} from 'api.js'
clickFunc(){
this.getApi()
}
async getApi(){
try{
let result = await xxx()
}catche(e){
console.log(e)
}
}