axios封裝一個具有請求/響應攔截的http請求

import axios from 'axios'
import qs from 'qs'

// 請求攔截
axios.interceptors.request.use(config => {
  // 此處可以封裝一些加載狀態
  return config
}, error => {
  return Promise.reject(error)
})

// 響應攔截
axios.interceptors.response.use(response => {
  return response
}, error => {
  return Promise.resolve(error.response)
})

function checkStatus (response) {
  // 此處可以封裝一些加載狀態
  // 如果http狀態碼正常，則直接返回數據
  if(response) {
    if (response.status === 200 || response.status === 304) {
      return response.data
      // 如果不需要除了data之外的數據，可以直接 return response.data
    } else if (response.status === 401) {
      location.href = '/login';
    } else {
      throw response.data
    }
  } else {
    throw {data:'網絡錯誤'}
  }
  
}

// axios默認參數配置
axios.defaults.baseURL = '/api/v0';
axios.defaults.timeout = 10000;

// restful API封裝
export default {
  post (url, data) {
    return axios({
      method: 'post',
      url,
      data: qs.stringify(data),
      headers: {
        'X-Requested-With': 'XMLHttpRequest',
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
      }
    }).then(
      (res) => {
        return checkStatus(res)
      }
    )
  },
  get (url, params) {
    return axios({
      method: 'get',
      url,
      params, // get 請求時帶的參數
      headers: {
        'X-Requested-With': 'XMLHttpRequest'
      }
    }).then(
      (res) => {
        return checkStatus(res)
      }
    )
  },
  del (url, params) {
    return axios({
      method: 'delete',
      url,
      params, // get 請求時帶的參數
      headers: {
        'X-Requested-With': 'XMLHttpRequest'
      }
    }).then(
      (res) => {
        return checkStatus(res)
      }
    )
  }
}