项目中通常使用token进行用户权限认证，需要在请求的header中添加token信息进行验证，拦截返回的状态码进行跳转或重新登陆，在全局配置这些不妥，所以新建一个axios实例进行项目的配置。 // util.jsimport axios from 'axios'import cookies from 'vue-cookies'import router from 'vue-router'export const $axios = axios.create({ // 这里是配置项 timeout: 7000,})// 拦截请求$axios.interceptors.request.use( config => { console.log(config); let t = cookies.get('t') if (t) { config.headers.t = t } else { router.replace({path: '/login'}) } return config }, err => { return Promise.reject(err) })// 拦截响应$axios.interceptors.response.use( response => { console.log(response) return response }, err => { console.log(err); if (err.response) { switch (err.response.status) { case 401: // 这里写清除token的代码 router.replace({ path: 'login', query: {redirect: router.currentRoute.fullPath} // 登录成功后跳入浏览的当前页面 }) } } return Promise.reject(err) })
使用
import Vue from 'vue'import {$axios} from './assets/lib/util'Vue.prototype.$http = $axiosposted @ 2019-01-28 13:21 xtjatswc 阅读( ...) 评论( ...) 编辑 收藏