1丶配置请求头
const request = axios.create({
baseURL: 'http://ttapi.research.itcast.cn/' // 基础路径
})
2丶配置请求拦截器
import axios from 'axios'
import store from '@/store'
// 请求拦截器
request.interceptors.request.use(
function(config) {
// config :本次请求的配置对象
// config 里面有一个属性: headers
const user = store.state.user
console.log(user)
if (user && user.token) {
config.headers.Authorization = `Bearer ${user.token}`
}
return config
},
function(error) {
return Promise.reject(error)
}
)
export default request
3丶配置响应拦截器
import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import axios from 'axios'
// 引入store
import store from './store'
//与后端定义状态是100签名错误 跳转到登录界面
axios.interceptors.response.use(
response => {
//当返回信息为未登录或者登录失效的时候重定向为登录页面
if (response.data.status == 100 || response.data.message == '用户未登录或登录超时,请登录!') {
router.push({
path: "/",
querry: { redirect: router.currentRoute.fullPath }//从哪个页面跳转
})
}
return response;
},
error => {
return Promise.reject(error)
}
)
以上代码写在request.js文件里