examcloud-web-photo-upload/src/main.js

import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import "./assets/css/common.css";

import axios from "axios";
const axiosRetry = require("axios-retry");

Vue.config.productionTip = false;
// Vue.use(VueResource);
Vue.use(ElementUI);

const qmInstance = axios.create({});
let wk_token;
// 正在处理的请求数
window.requestInProcessingTotal = 0;
// 并发的总错误数
window.faceppConcurrencyErrorNum = 0;
// 每分钟并发错误的数量
window.faceppConcurrencyErrorNumPerMinute = 0;
let faceppConCurrencyErrorArray = [];
qmInstance.interceptors.request.use(
  config => {
    if (config.url.includes("/login") === false) {
      if (!wk_token) {
        wk_token = window.localStorage.getItem("token");
      }
      if (wk_token && config.headers.common["token"] == null) {
        config.headers.common["key"] = window.localStorage.getItem("key");
        config.headers.common["token"] = wk_token;
      }
    } else {
      wk_token = null;
    }

    window.requestInProcessingTotal++;

    return config;
  },
  error => {
    console.log(error);
    return Promise.resolve(error);
  }
);

// 计算每分钟的并发错误数
function calcErrorPerMinute(now) {
  const valid = faceppConCurrencyErrorArray.filter(
    t => now - t < 3 * 60 * 1000
  );
  window.faceppConcurrencyErrorNumPerMinute = (
    (60 * 1000 * valid.length) /
    (now - valid[0])
  ).toFixed(2);
  if (valid.length <= 1) {
    window.faceppConcurrencyErrorNumPerMinute = 0;
  }
}

//响应拦截
qmInstance.interceptors.response.use(
  response => {
    window.requestInProcessingTotal--;

    // 相当于timer的作用
    const now = Date.now();
    calcErrorPerMinute(now);
    return response;
  },
  error => {
    window.requestInProcessingTotal--;
    // 这里是返回状态码不为200时候的错误处理
    const status = error.response.status;
    if (status != 200) {
      console.log(error);
      if (error.response.data.error_message) {
        console.log(error.response.data.error_message);
        if (error.response.data.error_message.toLowerCase().includes("limit")) {
          // 这是facepp并发错误的response特征
          const now = Date.now();
          faceppConCurrencyErrorArray.push(now);
          if (faceppConCurrencyErrorArray.length > 200) {
            faceppConCurrencyErrorArray.shift();
          }
          calcErrorPerMinute(now);

          window.faceppConcurrencyErrorNum++;
        }
      }
    }

    // 判断reponse的内容，如果是no login就退出
    if (
      error.response.data.code === "403"
      //  &&
      // error.response.data.desc === "no login." // 线上可能是 token is wrong
    ) {
      wk_token = null;
      localStorage.removeItem("rootOrgId");
      localStorage.removeItem("userName");
      window.localStorage.removeItem("token");
      window.localStorage.removeItem("key");
      if (Date.now() - (window.logAlertDate || 0) > 10000) {
        window.logAlertDate = Date.now();
        alert("登录失效 跳转登录页面");
      }
      // router.push({
      //   name: "login"
      // });
      location.replace("/");
    }

    // 登录失效 跳转登录页面 //facepp可能返回403
    // if (status == 403 || status == 401) {
    //   wk_token = null;
    //   localStorage.removeItem("rootOrgId");
    //   localStorage.removeItem("userName");
    //   localStorage.removeItem("user_token");
    //   if (Date.now() - (window.logAlertDate || 0) > 10000) {
    //     window.logAlertDate = Date.now();
    //     alert("登录失效 跳转登录页面");
    //   }
    //   router.push({
    //     name: "login"
    //   });
    // }
    return Promise.reject(error);
  }
);

qmInstance.defaults.withCredentials = true; //允许跨域携带cookie
qmInstance.defaults.timeout = 10000; //超时时间
qmInstance.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest"; //标识这是一个 ajax 请求

axiosRetry(qmInstance, {
  retries: 5, // 重试5次
  retryCondition: err => {
    // 根据err的特征来执行请求，目前是全部请求
    console.log(
      `below error status code: ${err.response.status} and retry ...`
    );
    console.log(err);
    console.log();
    return true;
  }
});

Vue.prototype.$http = qmInstance;

new Vue({
  router,
  render: h => h(App)
}).$mount("#app");