关于 axios.request 的封装


import axios from 'axios'
import Store from '../store/index.js'
import Router, { resetRouter } from '../router/index.js'
import { Message } from 'element-ui'
// 导入纳米级进度条
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

// 开发环境
export const baseURL = 'https://test.xxx.com'
// 生产环境
// export const baseURL = 'https://xxx.com'

axios.defaults.baseURL = baseURL
axios.defaults.headers.post['Content-Type'] = 'application/json'
axios.defaults.timeout = 10000

export default function(params) {
  NProgress.start()
  const { url, method = 'get', data = {} } = params
  const Authorization = sessionStorage.getItem('token')
  const headers = {}
  if (Authorization) {
    headers.Authorization = Authorization
  }

  const query = {
    url: url,
    method: method.toLowerCase(),
    headers
  }
  if (method.toLowerCase() === 'get') {
    query.params = data
  } else {
    query.data = data
  }

  return new Promise((resolve, reject) => {
    axios
      .request(query)
      .then(res => {
        NProgress.done()
        resolve(res)
      })
      .catch(err => {
        NProgress.done()
        reject(err)
      })
  })
}

axios.interceptors.request.use(
  function(config) {
    if (config.baseURL === 'https://test.xxx.com') {
      console.log('%c测试服', 'color: red;')
    }
    const token = Store.state.token
    // 在发送请求之前做些什么
    if (token) {
      config.headers.Authorization = token
    }
    return config
  },
  function(error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

// 添加响应拦截器
axios.interceptors.response.use(
  function(response) {
    // 对响应数据做点什么
    // 6 token 过期
    if (response.data.ret === 6) {
      sessionStorage.removeItem('token')
      resetRouter()
      Store.commit('RESER_ALLOW_ROUTES')
      Message.error('登录过期, 请重新登录')
      Store.dispatch('delAllViews').then(() => {
        Router.replace('/login')
      })
      // sessionStorage.removeItem('token')
      // Router.redirect('/login')
      return
    }
    return response.data
  },
  function(error) {
    // 对响应错误做点什么
    return Promise.reject(error)
  }
)

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM