三方登录

1、微信登录

function WXLogin() {
  let url = "需要跳转回的URL";
  //这里有登录之前的协议阅读限制,项目不同,要求也不一样
  if (this.check_) {
    const dom = document.getElementById("checkbox_");
    this.check_ = false;
    //跳转到微信登录页,会出现一个二维码弹窗,扫码后会消失
    window.location.href = `https://open.weixin.qq.com/connect/qrconnect?appid=wx901e99869df0daaf&redirect_uri=${url}&response_type=code&scope=snsapi_login&state=STATE#wechat_redirect`;
  } else {
    this.notice = "请先阅读并同意协议";
    this.showNotice = true;
    setTimeout(() => {
      this.showNotice = false;
    }, 2000);
  }
}

2、QQ 登录

function QQLogin() {
  //   let url = store.state.callBackURL;   因为我们项目分为测试环境和正式环境,需要配置不同的地址,所以可以使用环境变量(本项目是在vue store里面配置,所以直接引用store就可以)
  let url = "需要跳转回的URL";
  if (this.check_) {
    const dom = document.getElementById("checkbox_");
    dom.checked = false;
    this.check_ = dom.checked;
    window.location.href = `https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=101982828&redirect_uri=${url}&scope=get_user_info`;
  } else {
    this.notice = "请先阅读并同意协议";
    this.showNotice = true;
    setTimeout(() => {
      this.showNotice = false;
    }, 2000);
  }
}