浙里办 微信小程序单点登录、二次回退

现在要上架浙里办,还得兼容浙里办的微信小程序。

1.首先得升级引入的zwjsbridge.js到1.1.0

2.要判断,我们的浙里办应用是在微信小程序单点登录还是在浙里办AppIRS单点登录

if (ZWJSBridge.ssoTicket) {
    // 微信单点登录
  } else {
    //使用 IRS【个人/法人单点登录】组件
  }

3.如果浙里办AppIRS单点登录,就走我们以前单点登录那套逻辑,从url获取ticket

4.如果是微信小程序的单点登录,就从我们升级的ZWJSBridge的ssoTicket方法拿ticket,这个时候还需判断一下,是否在微信小程序登录并且成功拿到ticket,如果没有则还是要走IRS单点登录

    const ssoFlag = await ZWJSBridge.ssoTicket({});
    // 微信单点登录
    if (ssoFlag && ssoFlag.result === true) {
      //使用 IRS“浙里办”单点登录组件
      if (ssoFlag.ticketId) {
        // TODO:应用方服务端单点登录接口
      } else {
        // 当“浙里办”单点登录失败或登录状态失效时调用ZWJSBridge.openLink方法重新获取ticketId
        ZWJSBridge.openLink({ type: "reload" })
          .then((res) => {
            // res.ticketId
          .catch((err) => {
          });
      }
    } else {
      //使用 IRS【个人/法人单点登录】组件
    }

综上,浙里办App单点登录、浙里办微信小程序单点登录的基本流程就是这样的

附上完整代码:

1. 登录方法

zwSingleLogin({ zlbLogin = null } = {}) {
  console.warn("ssoTicket 1", ZWJSBridge.ssoTicket);
  if (ZWJSBridge.ssoTicket) {
    const ssoFlag = await ZWJSBridge.ssoTicket({});
    console.warn("ssoFlag", ssoFlag);
    // 微信单点登录
    if (ssoFlag && ssoFlag.result === true) {
      //使用 IRS“浙里办”单点登录组件
      if (ssoFlag.ticketId) {
        console.warn("ssoTicket 2", ssoFlag, ssoFlag.ticketId);
        // TODO:应用方服务端单点登录接口
        // ssoFlag.ticketId
      } else {
        // 当“浙里办”单点登录失败或登录状态失效时调用ZWJSBridge.openLink方法重新获取ticketId
        ZWJSBridge.openLink({ type: "reload" })
          .then((res) => {
            // res.ticketId
          })
          .catch((err) => {
          });
      }
    } else {
      //使用 IRS【个人/法人单点登录】组件
      if (zlbLogin) zlbLogin();
    }
  } else {
    //使用 IRS【个人/法人单点登录】组件
    if (zlbLogin) zlbLogin();
  }
}

2. 首页onLoad调用


    let that = this;
    zwSingleLogin({
       zlbLogin: function () {
       that.IRSLogin();
        },
    });

    IRSLogin() {
      let ticket = getTicketByUrl();
      if (ticket && !uni.getStorageSync("fc_token")) {
        // 用ticket去获取token,这个接口是后端写的
      }
      if (!ticket && !uni.getStorageSync("fc_token")) {
        // 没有ticket,则需重定向登录
        zlbRecirect();
      }
    };

3.截取url获取ticket

getTicketByUrl() {
  let ticket = null;
  let reg = new RegExp("(^|&)" + "ticket" + "=([^&]*)(&|$)");
  let r = location.href.substr(1).match(reg);
  if (r != null) ticket = unescape(r[2]).replace("#/", "");
  console.log("截取url获取ticket--->", ticket);
  return ticket;
}

4. 重定向方法

zlbRecirect() {
  let urlMobile =
    "https://puser.zjzwfw.gov.cn/sso/mobile.do?xxxxx";
  let urlAlipay =
    "https://puser.zjzwfw.gov.cn/sso/alipay.do?xxxxx";

  let url = "";
  let zwPlatform = checkZwPlatform();
  if (zwPlatform === "app") url = urlMobile;
  if (zwPlatform === "mini") url = urlAlipay;

 // 要重定向的时候,才监听,用于二次回退的问题
  gobackByPageshow();

  window.location.replace(url);
}

// 检查平台 是浙里办APP 还是支付宝
checkZwPlatform() {

  const sUserAgent = window.navigator.userAgent.toLowerCase();
  // 浙里办APP
  const bIsDtDreamApp = sUserAgent.indexOf("dtdreamweb") > -1;
  // 支付宝小程序
  const bIsAlipayMini =
    sUserAgent.indexOf("miniprogram") > -1 && sUserAgent.indexOf("alipay") > -1;

  let result = "";

  if (bIsDtDreamApp === true) {
    result = "app";
  } else if (bIsAlipayMini === true) {
    result = "mini";
  }
  return result;
}

5. 二次回退的监听方法

gobackByPageshow() {
  window.onpageshow = (event) => {
    console.log("navigation.type=" + window.performance.navigation.type);
    console.log("navigation.type= 11111");
    if (
      event.persisted ||
      (window.performance && window.performance.navigation.type == 2)
    ) {
      ZWJSBridge.close();
    }
  };
}

你可能感兴趣的:(浙里办,uniapp,小程序,前端)