App端登陆相关的SDK需要在manifest中配置:
- 打开 manifest.json -> App模块权限配置,勾选 OAuth(登陆鉴权)。
- 打开 manifest.json -> App SDK配置,查看到登陆鉴权。在说明中有蓝色链接,其中包括向微信、QQ、微博等平台申请sdk的链接。
- 向微信、QQ、微博等平台申请到sdk的信息后,回填到manifest里。
- 这些配置需要打包生效,真机运行仍然是HBuilder基座的设置,可使用自定义基座包。离线打包请参考离线打包文档在原生工程中配置。
- 配置并打包后,通过
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"
});
}
}
})
}
})
}
});
},