多接口同时调用 propmise.all

搞一个平台,嵌入多个项目,登录接口处需要拿到所有项目的token,后端不想搞新接口,那前端来处理,登录页面同时调取多个平台的接口,使用promise.all来处理

javascript 复制代码
  if (valid) {
        // yiheng
        const yhData = {
          account: this.loginForm.username,
          password: this.loginForm.password,
        };
        let p1 = new Promise((resolve, reject) => {
          axios({
            method: "post",
            url: "/yh/auth/login",
            data: yhData,
          })
            .then((res) => {
              this.TokenSetting("YHToken", res.data.data.token);
              resolve(res);
            })
            .catch((e) => {
              reject("发生错误");
            });
        });
        // yifu
        const yfData = {
          username: this.loginForm.username,
          password: this.loginForm.password,
        };
        let p2 = new Promise((resolve, reject) => {
          axios({
            method: "post",
            url: "/api/v1.0/users/login",
            data: yfData,
          })
            .then((res) => {
              this.TokenSetting("YFToken", res.data.data.access_token);
              resolve(res);
            })
            .catch((e) => {
              reject("发生错误");
            });
        });
        Promise.all([p1, p2])
          .then((results) => {
            this.$router.push({
              path: "/applicationSoftware",
            });
          })
          .catch((e) => {
            this.$message.error(e);
          });
      } else {
        return false;
      }
    });
  }

  TokenSetting(TokenKey: string, TokenVal: string) {
    localStorage.setItem(TokenKey, TokenVal);
  }

涉及到跨域问题,在vue.config,js文件中配置

javascript 复制代码
 devServer: {
    // open: true, // 配置项目在启动时自动在浏览器打开
    proxy: {
        '/yh' : { // '/api'是代理标识,一般是每个接口前的相同部分
            target: "http://192.168.5.58:8002", // 请求地址,一般是服务器地址
            changeOrigin: true, // 是否进行跨域
            // pathRewrite: { // pathRewrite的作用是把请求接口中的 '/api'替换掉,一般是替换为空""
            //     '^/api':""
            // }
        },
        '/api':{
          target: "http://192.168.5.52:8021", // 请求地址,一般是服务器地址
          changeOrigin: true, // 是否进行跨域
        }
    },
  }

yh的请求路径是:http://192.168.5.58:8002/yh/auth/login

yf的请求路径是:http://192.168.5.52:8021/api/v1.0/users/login

相关推荐
+VX:Fegn08955 小时前
计算机毕业设计|基于springboot + vue蛋糕店管理系统(源码+数据库+文档)
前端·数据库·vue.js·spring boot·课程设计
老男孩游戏时光13 小时前
Vue3 Composition API 最佳实践,别再乱写 setup 了
vue.js
+VX:Fegn089513 小时前
计算机毕业设计|基于java+ vue共享单车信息系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
Bs_MoneyMagnet14 小时前
基于springboot+vue的非遗物质文化遗产系统的设计与实现 源码+文档
java·vue.js·spring boot·后端·spring·毕业设计·计算机毕业设计
计算机毕设定制辅导-无忧学长14 小时前
《基于SpringBoot的未成年人健康知识科普平台的设计与实现》
java·开发语言·vue.js·spring boot·未成年人健康知识科普平台
专业程序开发源17 小时前
springboot篮球联赛管理系统13635-计算机课程设计、毕业设计
vue.js·spring boot·后端·python·django·php·课程设计
一 乐17 小时前
自习室座位预约管理系统|基于springboot + vue自习室座位预约管理系统(源码+数据库+文档)
java·vue.js·spring boot
晚安日记wanna18 小时前
Vue2 的 defineProperty 差在哪四层追问筛掉九成候选人
前端·vue.js·面试
dy17171 天前
vue2树节点刷新后定位到上一节点展开
vue.js
高级程序源1 天前
django大学生创新创业项目管理系统94923-计算机课程设计、毕业设计
javascript·vue.js·spring boot·后端·python·django·课程设计