axios封装配置(包含加载中)

axios.js

import axios from "axios"
import Cookies from "js-cookie"
import { Message } from "element-ui"
import jsencrypt from '@/api/jsencrypt'
import Vue from 'vue'
axios.defaults.baseURL = 'http://xxxxxx/'//地址
// loading框设置局部刷新,且所有请求完成后关闭loading框
let loading;
function startLoading () {
  loading = Vue.prototype.$loading({
    lock: true,
    text: "Loading...",
    target: document.querySelector('.loading-area')//设置加载动画区域
  });
}
function endLoading () {
  loading.close();
}
//声明一个对象用于存储请求个数
let needLoadingRequestCount = 0;
function showFullScreenLoading () {
  if (needLoadingRequestCount === 0) {
    startLoading();
  }
  needLoadingRequestCount++;
}
function tryHideFullScreenLoading () {
  if (needLoadingRequestCount <= 0) return;
  needLoadingRequestCount--;
  if (needLoadingRequestCount === 0) {
    endLoading();
  }
}
// http request 拦截器
axios.interceptors.request.use(config => {
  showFullScreenLoading(); //显示加载中
  if (Cookies.get("token")) {
    config.headers.token = Cookies.get("token")
  }
  if (config.method == 'post') {
    config.headers.urlflag = sessionStorage.getItem("path")
    config.headers.timespan = Date.parse(new Date()) / 1000;//encryptData(keys, Date.parse(new Date()) / 1000)
  } else if (config.method == 'get') {
    config.headers.urlflag = sessionStorage.getItem("path")
    config.headers.timespan = Date.parse(new Date()) / 1000; //encryptData(keys, Date.parse(new Date()) / 1000)
  }
  return config
}, error => {
  tryHideFullScreenLoading();//隐藏加载中
  return Promise.reject(error.response)
})

// http response 拦截器
axios.interceptors.response.use(
  response => {
    tryHideFullScreenLoading();//隐藏加载中
    if (response.data.StatusCode == 'Ok') {  //和后台商量返回什么
      return Promise.resolve(response)
    } else if (response.data.StatusCode == 'Fail') {
      Message({
        showClose: true,
        message: response.data.Message,
        type: "error",
        offset: 300
      })
      return Promise.reject(response)
    } else if (response.data.StatusCode == 'NoLogin') {
      Message({
        showClose: true,
        message: response.data.Message,
        type: "warning",
        offset: 400
      })
      sessionStorage.removeItem("addTab");
      Cookies.remove("token")
      location.reload()
    } else if (response.data.StatusCode == 'Stop') {
      Message({
        showClose: true,
        message: response.data.Message,
        type: "warning",
        offset: 400
      })
      sessionStorage.removeItem("addTab");
      Cookies.remove("token")
      location.reload()
    } else if (response.data.StatusCode == 'IllegalRequest') {
      Message({
        showClose: true,
        message: response.data.Message,
        type: "warning",
        offset: 400
      })

    } else if (response.data.StatusCode == 'NoPurview') {
      Message({
        showClose: true,
        message: response.data.Message,
        type: "warning",
        offset: 400
      })
    } else {
      return Promise.resolve(response)
    }
  },
  error => {
    tryHideFullScreenLoading();//加载中
    if (error.response.status === 404) {
      Message({
        showClose: true,
        message: "请求地址出错",
        type: "warning",
        offset: 400
      })
    } else if (error.response.status === 401) {
      Message({
        showClose: true,
        message: error.response.data.Message,
        type: "warning",
        offset: 400
      })
      sessionStorage.removeItem("addTab");
      Cookies.remove("token")
      setTimeout(() => {
        location.reload()
      }, 3000)
    }
    return Promise.reject(error.response) // 返回接口返回的错误信息
  })
//  封装get方法,返回promise对象
export function get (url, params = {}) {
  return new Promise((resolve, reject) => {
    axios.get(url, {
      params: params
    })
      .then(response => {
        resolve(response);
      })
      .catch(err => {
        reject(err)
      })
  })
}
// 封装post请求
export function post (url, data = {}) {
  return new Promise((resolve, reject) => {
    axios.post(url, data)
      .then(response => {
        resolve(response);
      }, err => {
        reject(err)
      })
  })
}
// 封装getAwait方法,返回async方法
export async function getAwait (url, params = {}) {
  let res = await axios.get(url, { params: params })
  res = res.data
  return res
}
// 封装postAwait 方法,返回async方法
export async function postAwait (url, data = {}) {
  let res = await axios.post(url, data)
  res = res.data
  return res
}
export default axios
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值