uniapp-实现在App端授权qq,微信,微博登录

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

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

APP微信授权登录

uni.login({
	provider: 'weixin',
	success: res => {
		uni.getUserInfo({
			provider: 'weixin',
			success: function(infoRes) {
				let formdata = {
					nickName: infoRes.userInfo.nickName,
					gender: infoRes.userInfo.gender,
                    headImgUrl: infoRes.userInfo.avatarUrl,
					openId: infoRes.userInfo.openId,
					unionId: infoRes.userInfo.unionId
				};
				uni.request({
					url: 'http://192.168.43.205:8080/thirdPartLogin/app/login',
					method: 'POST',
					data: formdata,
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: res => {
						if (res.data.code != 200) {
							uni.showToast({
								title: res.data.err,
								duration: 3000,
								icon: 'none'
							});
							return false;
						} else {
							//登录成功处理
							uni.showToast({
								title: res.data.message,
								duration: 3000,
								icon: 'none'
							});
							let ticket = res.data.ticket;
							uni.setStorageSync('ticket', ticket);
							uni.reLaunch({
								url: '../my/my'
							});
							return true;
						}
					}
				});
			}
		});
	},
	fail: err => {
		uni.showToast({
			title: '请求出错啦!',
			icon: 'none',
			duration: 3000
		});
	}
});

后端直接根据unionId来判断用户的唯一性。

APPQQ授权登录

uni.login({
	provider: 'qq',
	success: resp => {
		var access_token = resp.authResult.access_token;
		uni.getUserInfo({
			provider: 'qq',
			success: function(infoRes) {
				var formdata = {
					nickName: infoRes.userInfo.nickname,
					gender: infoRes.userInfo.gender == '男' ? 1 : 2,
                    headImgUrl: infoRes.userInfo.figureurl_qq_2,
					openId: infoRes.userInfo.openId,
					access_token: access_token
				};
				uni.request({
					url: 'http://192.168.43.205:8080/thirdPartLogin/app/login',
					method: 'POST',
					data: formdata,
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: res => {
						if (res.data.code != 200) {
							uni.showToast({
								title: res.data.err,
								duration: 3000,
								icon: 'none'
							});
							return false;
						} else {
							//登录成功处理
							uni.showToast({
								title: res.data.message,
								duration: 3000,
								icon: 'none'
							});
							let ticket = res.data.ticket;
							uni.setStorageSync('ticket', ticket);
							uni.reLaunch({
								url: '../my/my'
							});
							return true;
						}
					}
				});
			}
		});
	},
	fail: err => {
		uni.showToast({
			title: '请求出错啦!',
			icon: 'none',
			duration: 3000
		});
	}
});

后端直接根据access_token来判断用户的唯一性。

以上展示的都是最重要的代码,复制就可以使用,自己可以加一些加载显示等。

完整版uni-app实现在App端授权qq,微信,微博登录代码如下所示:






 

你可能感兴趣的:(Uni-app,android)