axios拦截token

1、首先设置拦截器，拦截token，给全局http请求header中加上token

import axios from 'axios'
import store from './store'//将token存入全局store中

// http请求拦截器
axios.interceptors.request.use(config => {//请求
  if(store.state.token){//如果token存在
    config.headers.token = store.state.token;
  };
  store.state.loadState = true;
  return config
}, error => {
  store.state.loadState = false;
  return Promise.reject(error)
})

axios.interceptors.response.use(data => {//响应
  store.state.loadState = false;
  if(data.data.respCode === '00'){//状态码判断，00成功状态
    return data.data
  }
  if(data.data.respCode === '000000'){//状态码000000为成功状态 
    return data.data
  } else{
    store.state.messageWarningState = true;
    store.state.tipsMsg_warn = data.data.respMsg;
    setTimeout(() =>{
      store.state.messageWarningState = false;
    }, 2000);

  };
  // return data.data
}, error => {
  store.state.loadState = false;
  store.state.messageWarningState = true;
  setTimeout(() =>{
    store.state.messageWarningState = false;
  }, 2000);
  return Promise.reject(error)
})

export default axios

2、在store中获取token

import Vue from 'vue'
import Vuex from 'Vuex'
Vue.use(Vuex);
//使用cookie截取token，根据公司token存储方式不同截取方式不同
var VueCookie = require('vue-cookie');
Vue.use(VueCookie);
const store = new Vuex.Store({//新建一些全局变量
//定义状态
state:{
    //某些全局变量，或者数据
    token:VueCookie.get('key')//token以‘key’值保存，一般前端页面样式调整可将token设为固定值
    }
})
export default store;

3、在main.js中配置axios和注册全局变量

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
//引入store
import Vuex from 'vuex'
import store from './components/commonjs/store'
Vue.use(Vuex);

// http请求，即全局axios配置
import axios from './components/commonjs/http'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios)

//Vue.prototype.$vux = Vux
// cookie
var VueCookie = require('vue-cookie');
Vue.use(VueCookie);
// filter
import './components/commonjs/filter'
Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,//注册store
  template: '<App/>',
  components: { App }
})