axios封装简明的request请求

下面以Vue为例来封装request请求

request.js:

import axios from 'axios'
import { getToken } from '@/utils/auth'
import { Message } from 'element-ui'
import store from '@/store'
import router from '../router'

const service = axios.create({
  baseURL: window.baseUrl, // api的base_url
  timeout: 10000 // 请求超时设置
})

// request拦截器
service.interceptors.request.use(
  config => {
    if (store.getters.token) {
      config.headers['Authorization'] = 'Bearer ' + getToken()
    }
    return config
  },
  error => {
    Promise.reject(error)
  }
)

// response拦截器
service.interceptors.response.use(
  response => {
    const res = response.data
    if (res.code === 10000) {
      // 成功回调
      return Promise.resolve(res)
    } else {
      if (res.code === 10004) {
        // token 过期
        router.replace({ path: '/login' })
      }
      Message({
        message: res.msg,
        type: 'error',
        duration: 3 * 1000
      })
      return Promise.reject(res)
    }
  },
  error => {
    Message({
      message: error.msg,
      type: 'error',
      duration: 3 * 1000
    })
    return Promise.reject(error)
  }
)

export default service

 

你可能感兴趣的:(前端开发,Vue,React)