axios请求拦在器添加token（请求头添加token）保证有权访问请求数据~~

axios请求拦在器添加token

开发项目中有很多个请求接口，除了login以外其他的请求接口有了访问权限才能正常请求数据访问页面。

需要授权的API必须每一次的请求携带token，就是请求头添加token，后端根据token来判断该请求有没有授权。

那么必须在请求头中使用Authorization字段提供token令牌！--提供axios请求拦在器添加token

先把config打印出来看看，有没有Authorization字段

使用Ayuthozation给请求头添加token令牌

如果项目中使用vuex的时候  config.headers.Authorization 赋值给store里的token，main.js里引入了索引相关的vuex组件，直接获取

是因为目前登录组件是login，所有后台没给返回token令牌，结果也是null，如果是其他接口的话不会是null，分摊返回token令牌

---

拦截器介绍

一般在使用axios时，会用到拦截器的功能，一般分为两种：请求拦截器、响应拦截器。
请求拦截器
在请求发送之前进行必要操作处理，例如添加统一cookie、请求体加验证、设置请求头等，相当于是对每个接口里相同操作的一个封装。
响应拦截器
响应拦截器在响应数据之前进行必要的操作，只是在请求得到响应之后，对响应体的一些处理，通常用来对数据的处理、判断登陆失效等。

Axios实例

// 引入axios
import axios from 'axios'
// baseURL设置
let baseURL = 'xxxxxxxxxxx'
// 创建实例
let http1 = axios.create({
    baseURL,
    timeout: 2000 // 毫秒
})

配置拦在器

// 请求拦截器
实例1.interceptors.request.use(config => {}, err => {})
// 响应拦截器
实例1.interceptors.respone.use(respone => {}, err => {})

• 1.请求拦在器

// use(两个参数)
axios.interceptors.request.use(config => {
    // 在发送请求前做一些事
    ....
    return config
}, err => {
    // 在请求错误时做的事儿
    return Promise.reject(err)
})

• 2.相应拦在器

// use(两个参数)
axios.interceptors.respone.use(respone => {
    // 请求成功对响应数据做处理
    ....
    // 该返回的数据则是axios().then(res)中接受的数据
    return respone
}, err => {
    // 在请求错误时做的事儿
    // 该返回的数据则是axios.catch(err)中接收的数据
    return Promise.reject(err)
})

• 常见错误码处理（error）
• axios请求错误时，可在catch里进行错误处理。

  axios.get().then().catch(err => {
      // 错误处理
  })