• 移动端后台管理系统request.js结合业务封装axios


    import axios from 'axios'
    import { $t } from '../lang/index'
    import { Toast } from 'cube-ui'
    import store from '../store'
    import { getToken } from './auth'
    // import Qs from 'qs'

    const env = process.env

    // const Loading = Toast.$create({
    //   time: 0,
    //   mask: true
    // })

    const shouldRetry = (error) => {
      if (error.code === 'ECONNABORTED' && error.message.indexOf('timeout') !== -1) {
        return true
      } else {
        return false
      }
    }

    const httpRequest = axios.create({
      baseURL: '',
      timeout: env.VUE_APP_HTTP_TIMEOUT // request timeout
    })

    // 添加请求拦截器
    httpRequest.interceptors.request.use(
      config => {
        // Loading.show()
        // config.data = Qs.stringify(config.data)
        let token = getToken()
        if (token) {
          config.headers['Authorization'] = 'Bearer ' + token
        } else {
          config.headers['tt-token'] = store.state.ttToken
          config.headers['tt-control'] = store.state.ttControl
        }
        return config
      },
      error => {
        return errorHandelr(error)
      }
    )

    let __retryCount = 0

    // 添加响应拦截器
    httpRequest.interceptors.response.use(
      response => {
        const res = response.data
        if (res && res.code === Number(env.VUE_APP_SUCCESS_CODE)) {
        // Loading.hide()
          return res
        } else {
          let err = responseHandler(res)
          errorHandelr(err)
        }
      },
      error => {
        if (error && error.response) {
          let config = error.config
          // 判断是否需要重试
          if (!shouldRetry(error)) {
            return errorHandelr(error)
          }

          if (__retryCount >= env.VUE_APP_RETRY_COUNT) {
            return errorHandelr(error)
          }

          // 重试次数自增长
          __retryCount += 1

          // 延时处理
          var backoff = new Promise(function (resolve) {
            setTimeout(function () {
              resolve()
            }, env.VUE_APP_RETRY_DELAY || 1)
          })

          // 重新发起axios请求
          return backoff.then(function () {
            return httpRequest(config)
          })
        } else {
          return errorHandelr(error)
        }
      }
    )

    // TODO token失效处理
    // let tokenFailure = () => {}

    // 请求响应自定义状态码code逻辑处理
    let responseHandler = (res) => {
      // TODO 自定义code逻辑处理
      let errObj
      switch (res.code) {
        default:
          errObj = {
            errCode: res.code || null,
            errMsg: res.message || $t('request.default')
          }
          break
      }
      return errObj
    }

    // 请求响应错误提示
    let responseTips = (code) => {
      // TODO HTTP 状态码判断处理
      let message
      switch (code) {
        case 400:
          message = $t('request.e400')
          break
        case 401:
          message = $t('request.e401')
          break
        case 408:
          message = $t('request.e408')
          break
        case 500:
          message = $t('request.e500')
          break
        case 502:
          message = $t('request.e502')
          break
        case 504:
          message = $t('request.e504')
          break
        case 505:
          message = $t('request.e505')
          break
        case 10100000:
          message = $t('request.e10100000')
          break
        default:
          message = $t('request.default')
          break
      }
      return message
    }

    // 错误处理
    let errorHandelr = (error) => {
      __retryCount = 0
      // Loading.hide()
      let errObj = getErrorMsg(error)
      if (errObj && errObj.errMsg !== 'stopSource') {
        Toast.$create({
          txt: errObj.errMsg,
          type: 'txt',
          time: 1000,
          onTimeout: () => {
            if (errObj.errCode === 401) {
              // 表示token验证失败,踢出工作台
              window.$bridge.callHandler('closeWebview', {})
            }
          }
        }).show()
      }
      return Promise.reject(error)
    }

    // const defaultCode = ['404', '403', '500', '503']
    let getErrorMsg = (error) => {
      if (error.response) {
        let errCode = error.response.status
        return {
          errCode: errCode,
          errMsg: responseTips(errCode)
        }
      } else {
        return {
          errCode: error.code || null,
          errMsg: error.message || $t('request.default')
        }
      }
    }

    export default httpRequest
  • 相关阅读:
    shell80set变量
    shell79控制多进程的数量
    shell78管道
    sina sae开发中出现的问题
    html中代码高亮显示
    handlebars模板替换
    打印目录下所有的文件名(包含深层次目录)
    input为disabled提交后得不到该值的解决方法
    Global和Globals
    js算法运算
  • 原文地址:https://www.cnblogs.com/huayang1995/p/13806854.html
Copyright © 2020-2023  润新知