场景:新做的app登录时需要调用微信登录
解决:
1.登录微信开放平台,添加移动应用并提交审核,审核通过后可获取应用ID(AppID),AppSecret等信息。
2.在应用详情中申请开通
微信登录功能,根据页面提示填写资料,提交审核。
3.申请审核通过后即可打包使用微信授权登录功能。
配置:
打开项目的manifest.json文件,在“App模块配置”项的“OAuth(登录鉴权)”下,勾选“微信登录”:
微信登录前先检测一下用户收集是否安装微信,如未安装,提醒其安装。
//验证有无安装微信
let isWx = plus.runtime.isApplicationExist({pname:'com.tencent.mm',action:'weixin://'});
if(!isWx){
// console.log('请先安装微信APP');
return false;
}
APPID申请下来后,可以使用uni.getProvider(OBJECT)来获取服务
uni.getProvider({
service: 'oauth',
success: function (res) {
console.log(res.provider)
if (~res.provider.indexOf('qq')) {
uni.login({
provider: 'qq',
success: function (loginRes) {
console.log(JSON.stringify(loginRes));
}
});
}
}
});
获取用户信息用uni.getUserInfo(OBJECT)
登录成功后获取用户信息
uni.login({
provider: 'weixin',
success: function (loginRes) {
console.log(loginRes.authResult);
// 获取用户信息
uni.getUserInfo({
provider: 'weixin',
success: function (infoRes) {
console.log('用户昵称为:' + infoRes.userInfo.nickName);
}
});
}
});
完整微信登录代码
//验证有无安装微信
let isWx = plus.runtime.isApplicationExist({pname:'com.tencent.mm',action:'weixin://'});
if(!isWx){
// console.log('请先安装微信APP');
return false;
}
uni.getProvider({
service: 'oauth',
success: (res) => {
if (~res.provider.indexOf('weixin')) {//支持微信、qq和微博等
uni.login({
provider: 'weixin',
success: (loginRes) => {
uni.getUserInfo({
provider: 'weixin',
success: (userInfoRes) => {
console.log(222, userInfoRes)
if(userInfoRes && userInfoRes.userInfo && userInfoRes.userInfo.unionId && userInfoRes.userInfo.openId) {
//可以取到用户信息
let obj = {
unionId:userInfoRes.userInfo.unionId,//unionid
openId:userInfoRes.userInfo.openId,//openid
nickName:userInfoRes.userInfo.nickName,//昵称
avatarUrl:userInfoRes.userInfo.avatarUrl,//头像
gender:userInfoRes.userInfo.gender,//性别
}
// console.log('[获取到的用户信息]',obj);
addUserInfo(obj).then(res => {
// console.log('[登录返回的参数]',obj);
// console.log('[登录返回的参数]',res);
if(res.code==200){
uni.setStorageSync('user',res.result)
setTimeout(()=>{
uni.reLaunch({
url:'/pages/index/index'
})
},1500)
uni.showToast({
title: '登录成功',
duration: 3000
});
}else{
uni.showToast({
title: '登录失败',
duration: 2000
});
}
})
return false;
} else {
console.log('获取信息失败');
}
},
fail: (err) => {
console.log('获取信息失败',err);
}
})
},
fail: (err) => {
console.log('获取信息失败',err);
}
})
} else {
console.log('请先安装微信APP');
}
},
fail: (err) => {
console.log('请先安装微信APP',err);
}
})