移动:axios整体理解

2021/4/27 10:29:38

本文主要是介绍移动:axios整体理解,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

'use strict'

import Vue from 'vue'
import axios from 'axios'
import Util from '../assets/js/util.js'

// Full config:  https://github.com/axios/axios#request-config
// axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || '';
// axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

// let config = {
//   // baseURL: process.env.baseURL || process.env.apiUrl || ""
//   // timeout: 60 * 1000, // Timeout
//   // withCredentials: true, // Check cross-site Access-Control
// }

//const _axios = axios.create(config)

// Axios拦截器
axios.interceptors.request.use(
  // Do something before request is sent
  config => {
      /*时间设定*/
    config.timeout = 200000
      /*允许跨域*/
    config.withCredentials = true
    if (config.headers['Content-Type'] === undefined) {
      config.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8'
      // json -> form data
      config['transformRequest'] = [
        data => {
          return Util.jsonToString(data)
        }
      ]
    }
    // 判断是否为本地测试环境,如果是增加token
    if (process.env.NODE_ENV === 'development') {
      config.headers.common['token'] =
        'TGT-78-5ezn4skRcgX6Z72bSoGM42HxWcLVy05ANdrVvg6eMcqmnq0l4v-cas01.example.org'
    }
    return config
  },
  error => {
    if (Util.isEmpty(error.errorMessage)) {
      Object.assign(error, { errorMessage: '系统异常!' })
    }
    return Promise.reject(error)
  }
)
/*响应拦截器*/
axios.interceptors.response.use(
  // Do something with response data
  response => {
    if (Object.is(response.data.state, 'OK')) {
      return Object.assign({ success: true }, response)
    } else {
      return Object.assign({ success: false }, response)
    }
  },
  error => {
    if (Util.isEmpty(error.errorMessage)) {
      Object.assign(error, { errorMessage: '系统异常!' })
    }
    return Promise.reject(error)
  }
)

Plugin.install = function(Vue) {
  Vue.axios = axios
  window.axios = axios
  Object.defineProperties(Vue.prototype, {
    axios: {
      get() {
        return axios
      }
    },
    $axios: {
      get() {
        return axios
      }
    }
  })
}

Vue.use(Plugin)

export default Plugin



这篇关于移动:axios整体理解的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程