axios-请求拦截器(请求头中添加token)_请求拦截器设置token

处理请求一些带权限的接口(需要传递token),一个一个配置请求头太麻烦,在发起请求之前统一挂载token

//1.引入 axios
import axios from 'axios'

//2.拿到vuex中token
import store from '@/store/index.js'

//3.封装基础的地址
axios.defaults.baseURL = '请求地址根路径'

//4.请求拦截器
axios.interceptors.request.use(function (config) {
    console.log('请求拦截器');
    // 在发送请求之前做些什么
    //config本次请求的请求配置对象(包括请求地址 请求头)
    console.log('config', config);
    //已经登录并且存在token
    if (store.state && store.state.user && store.state.user.token) {
        //加入到请求头
        config.headers.Authorization = `Bearer ${store.state.user.token}`
    }
    //一定要返回config   否则请求停在这里 出不去
    return config;
}, function (error) {
    // 对请求错误做些(还没有发出请求)
    return Promise.reject(error);
});
//5.导出
export default axios
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28