vue axios的get,post封装

  

import Vue from 'vue'
import axios from 'axios';
import {
  MessageBox,
  Message
} from 'element-ui'
import router from "../router";
import store from '../store'
import qs from 'qs' //(两句很重要)


// 创建axios实例
const service = axios.create({
  timeout: 1000 * 12 // 请求超时时间
})



service.defaults.retry = 3 // 请求重试次数
service.defaults.retryDelay = 1000 // 请求重试时间间隔
service.defaults.shouldRetry = true // 是否重试 

axios.defaults.baseURL = "api"
// request拦截器
axios.interceptors.request.use(config => {

    let datap = config.method === 'get' ? 'params' : 'data';
    var getTokenServer = store.getters.getTokenServer
    var getToken = store.getters.getToken
    if (config.method === 'post') {
      config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
      config.headers['Accept-Language'] = 'zh-CN'
      if (!config.data) { // 没有参数时,config.data为null,需要转下类型
        config.data = {}
      }
    }

  
    if (getTokenServer && getToken) {
      var dataC = qs.parse(config[datap]);
      config[datap] = {
        ...dataC,
        tokenServer: getTokenServer,
        token: getToken
      }
      config[datap] = qs.stringify(config[datap])
    }
    return config
  },
  error => {
    Promise.reject(error)
  }
)



// response 拦截器
axios.interceptors.response.use(
  response => {
    if (response.data.code === 0) {
      if (response.data.info === '请先登录') {
        MessageBox.confirm(response.data.info, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          router.push({
            name: 'Login'
          })
        })
      }
    } else if (response.data.code === 403) {
      Message({
        showClose: true,
        message: response.data.info,
        type: 'warning',
        onClose: function () {
          router.push({
            name: 'Login'
          })
        }
      });
    }

    if (response.status !== 200) {
      return Promise.reject(response.data)
    } else {
      return response.data
    }



  },
  err => {
    var config = err.config
    return Promise.reject(config)
  }
)

Vue.prototype.$ajax = axios
Vue.prototype.$qs = qs

 

posted @ 2021-01-04 10:03  Day_Show  阅读(325)  评论(0编辑  收藏  举报