import axios from 'axios' import store from '@/store' import router from '@/router' import Vue from 'vue' const $axios = axios.create({ // 5 分钟超时 timeout: 300000, // 域名 baseURL: process.env.VUE_APP_BASE_API, headers: { 'Content-Type': 'application/json; charset=UTF-8' } }) Vue.prototype.$http = axios // 并发请求 // 在全局请求和响应拦截器中添加请求状态 const loading = null $axios.defaults.withCredentials = true // 请求拦截器 $axios.interceptors.request.use( config => { const token = store.getters.token if (token) { // 在请求的 Authorization 首部添加 token config.headers.Authorization = 'Bearer ' + token } return config }, error => { return Promise.reject(error) } ) // 响应拦截器 $axios.interceptors.response.use( response => { if (loading) { loading.close() } const code = response.status if ((code >= 200 && code < 300) || code === 304) { return Promise.resolve(response.data) } else { return Promise.reject(response) } }, error => { if (loading) { loading.close() } if (error.response) { const statusCode = error.response.status switch (statusCode) { case 401: // 清除用户信息和 token 并跳转到登录页面 store.dispatch('user/resetToken').then(() => { router.push('/login') }).catch(() => { }) // store.commit('setUserInfo', null) // commit('RESET_STATE') /* store.user.userInfo = null store.user.token = null console.log(store.user)*/ break case 404: console.error('网络请求不存在') break default: console.error(error.response) } return error.response } else { // 请求超时或者网络有问题 if (error.message.includes('timeout')) { console.error('请求超时!请检查网络是否正常') } else { console.error(error.message) console.error('请求失败,请检查服务器是否已启动') } } return Promise.reject(error) } ) // HTTP 请求 export default { get(url, params) { return $axios({ method: 'get', url, params }) }, post(url, data) { return $axios({ method: 'post', url, data: JSON.stringify(data) }) }, put(url, data) { return $axios({ method: 'put', url, data: JSON.stringify(data) }) }, delete(url, data) { return $axios({ method: 'delete', url, data: JSON.stringify(data) }) } }