vue 封装request请求 多域名访问

1.需求

我现在一个项目 有可能涉及到的数据多 服务器压力大,所以需要配置多个服务 就出现了一个问题,当第一个服务 调用不通或者失败了 立马换下一个域名调用 接口都是一一样的 就是 前段部分的域名不同

2.实现

import Taro from "@tarojs/taro";
// import QS from 'qs'
import qs from "qs";
import {
  getStorage,
  clearStorage,
  getCurrentPageUrlWithArgs,
} from "..//utils/tools";
import { useUserStore } from "../store";
import { log } from "console";
let needLoadingRequestCount = 0;
// loading配置,请求次数统计
function startLoading() {
  Taro.showLoading({ title: "加载中", mask: true });
}
function endLoading() {
  Taro.hideLoading();
} // 声明一个对象用于存储请求个数
function showFullScreenLoading() {
  if (needLoadingRequestCount === 0) {
    startLoading();
  }
  needLoadingRequestCount++;
}
function tryHideFullScreenLoading() {
  if (needLoadingRequestCount <= 0) return;
  needLoadingRequestCount--;
  if (needLoadingRequestCount === 0) {
    endLoading();
  }
}
export default function request(url, config: any = {}, needLoading = false) {
  const BASE_URLS = [
    "http://xxxx",
    "http://xxxx",
  ];
  const userStore = useUserStore();
  needLoading && showFullScreenLoading();

  const makeRequest = (baseUrl) => {
    return new Promise((resolve, reject) => {
      Taro.request({
        url: `${baseUrl}${url}`,
        method: config.type.toUpperCase() || "GET",
        data: config.data || {},
        header: {
          "Content-type": config.paramsFormdata || "application/json",
          "user-token": userStore.Token || "",
          ...config.header,
        },
        success: (result) => {
          const { statusCode, data } = result;
          console.log(result);

          if (statusCode === 200) {
            resolve(data);
          } else if (statusCode === 401) {
            Taro.removeStorageSync("TOKEN");
            Taro.removeStorageSync("userInfo");
            setTimeout(() => {
              Taro.redirectTo({
                url: "/pages/index/index",
              });
            }, 500);
          }
        },
        fail: (error) => {
          Taro.showToast({
            title: "网络错误",
            icon: "none",
          });
          reject(error);
        },
        complete: (res) => {},
      });
    });
  };

  // Attempt the first base URL
  return makeRequest(BASE_URLS[0]).catch((error) => {
    // If the first request fails, try the second base URL
    console.error(`Error with first base URL: ${error}`);
    return makeRequest(BASE_URLS[1]);
  });
}

3.总结

我这个域名目前配置了两个域名 当前就是第一个域名调用不通的时候 立马换第二个域名 ,当然如果需要多个 可以进行一下循环 ,这样的需求不知道大家会不会有 ,我分享在这了

相关推荐

  1. vue 封装request请求 域名访问

    2024-02-15 04:32:01       52 阅读
  2. Vue3+Vite+Axios Request 请求封装(TS版本)最新

    2024-02-15 04:32:01       36 阅读
  3. Python requests请求封装

    2024-02-15 04:32:01       55 阅读
  4. nginx单域名配置访问vue项目(vue3 + vite4)

    2024-02-15 04:32:01       57 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-02-15 04:32:01       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-02-15 04:32:01       101 阅读
  3. 在Django里面运行非项目文件

    2024-02-15 04:32:01       82 阅读
  4. Python语言-面向对象

    2024-02-15 04:32:01       91 阅读

热门阅读

  1. 限制Unity帧率的方式

    2024-02-15 04:32:01       59 阅读
  2. 前端项目自动化部署

    2024-02-15 04:32:01       54 阅读
  3. 生信中的差异分析

    2024-02-15 04:32:01       57 阅读
  4. vs c++ 项目生成可执行文件 exe

    2024-02-15 04:32:01       56 阅读
  5. 1+X运维试题样卷C卷(初级)

    2024-02-15 04:32:01       51 阅读
  6. CSS transition(过渡效果)详解

    2024-02-15 04:32:01       50 阅读
  7. 如何在 Python 中处理 Unicode

    2024-02-15 04:32:01       40 阅读
  8. 1191. 家谱树(拓扑排序,模板题)

    2024-02-15 04:32:01       62 阅读