实现在App端授权qq/微信/微博登录

App端登陆相关的SDK需要在manifest中配置:

  1. 打开 manifest.json -> App模块权限配置,勾选 OAuth(登陆鉴权)。
  2. 打开 manifest.json -> App SDK配置,查看到登陆鉴权。在说明中有蓝色链接,其中包括向微信、QQ、微博等平台申请sdk的链接。
  3. 向微信、QQ、微博等平台申请到sdk的信息后,回填到manifest里。
  4. 这些配置需要打包生效,真机运行仍然是HBuilder基座的设置,可使用自定义基座包。离线打包请参考离线打包文档在原生工程中配置。
  5. 配置并打包后,通过uni.getProvider可以得到配置的结果列表,注意这里返回的是manifest配置的,与手机端是否安装微信、QQ、微博无关。

如果手机端未安装QQ、微博,调用时会启动这些平台的wap页面登陆,如果已安装相应客户端,会启动它们的客户端登陆。

 

 

<!-- 5+app 用qq/微信/微博 登录 小程序用微信小程序登录 h5不支持 -->
<!-- #ifdef APP-PLUS -->
<image src="../../static/icos/weixin.png" data-logintype="weixin" @click="appOAuthLogin" class="third-ico"></image>
<image src="../../static/icos/QQ.png" data-logintype="qq" @click="appOAuthLogin" class="third-ico" style="margin-left: 80upx;"></image>
<image src="../../static/icos/weibo.png" data-logintype="sinaweibo" @click="appOAuthLogin" class="third-ico" style="margin-left: 80upx;"></image>
<!-- #endif -->
appOAuthLogin(e) {
  var me = this;
  // 1 获取用户的登录类型
  var logintype = e.currentTarget.dataset.logintype;
  // 2 授权登录,弹出授权窗口
  uni.login({
    provider: logintype,
    success(loginRes) {
      // 3 授权登录成功以后,获取用户的信息
      uni.getUserInfo({
        provider: logintype,
        success(info) {
          var userInfo = info.userInfo;
          var face = "";
          var nickname = "";
          var openIdOrUid = "";
          if (logintype == "weixin") {
            openIdOrUid = userInfo.openId;
            face = userInfo.avatarUrl;
            nickname = userInfo.nickName;
          } else if (logintype == "qq") {
            openIdOrUid = userInfo.openId;
            face = userInfo.figureurl_qq_2;
            nickname = userInfo.nickname;
          } else if (logintype == "sinaweibo") {
            openIdOrUid = userInfo.id;
            face = userInfo.avatar_large;
            nickname = userInfo.nickname;
          }
          
          // 4 调用开发者后台,执行一键注册或登录
          uni.request({
            url: me.serverUrl + "/appUnionLogin/" + logintype,
            data: {
              "openIdOrUid": openIdOrUid,
              "nickname": nickname,
              "face": face
            },
            method: "POST",
            success(result) {
              if (result.data.status == 200) {
                var userInfo = result.data.data;
                // 5 保存用户信息到全局的缓存中
                uni.setStorageSync("globalUser", userInfo);
                // 6 切换页面跳转,使用tab切换的api
                uni.switchTab({
                  url: "../me/me"
                });
              }
            }
          })
        }
      })
    }
  });
},

 

  • 0
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

佛佛ง

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值