使用請求攔截器統一添加 Token

項目中的接口除了登錄之外大多數都需要提供 token 才有訪問權限

方式一：在每次請求的時候手動添加（麻煩）。

axios({
  method: "",
  url: "",
  headers: {
    Authorization: "Bearer token"
  }
})

方式二：使用請求攔截器統一添加（更方便）。

在axios中設置統一的token

/**
 * 請求模塊
 */
import axios from 'axios'

// 在非組件模塊中獲取 store 必須通過這種方式
// 這里單獨加載 store，和在組件中 this.$store 一個東西
import store from '@/store/'

const request = axios.create({
  baseURL: 'http://ttapi.research.itcast.cn/' // 基礎路徑
})

// 請求攔截器
// Add a request interceptor
request.interceptors.request.use(function (config) {
  // Do something before request is sent
  const { user } = store.state

  // 如果用戶已登錄，統一給接口設置 token 信息
  if (user) {
    config.headers.Authorization = `Bearer ${user.token}`
  }

  // 處理完之后一定要把 config 返回，否則請求就會停在這里
  return config
}, function (error) {
  // Do something with request error
  return Promise.reject(error)
})

// 響應攔截器

// 導出
export default request