uni-app是一个使用Vue。js开发跨平台应用的前端框架。
适用平台:Android, iOS,微信小程序,实现了一套代码,同时发布到Android, iOS,微信小程序。
参考官方:https://uniapp.dcloud.io/
检测手机上是否安装微信,QQ,新浪微博等。
uni.getProvider ({
服务:oauth,
成功:函数(res) {
console.log (res.provider);
}
});
授权登录
获取openid, (unionid)等
uni.login ({
提供者:“weixin”,
成功:函数(loginRes) {
console.log (JSON.stringify (loginRes));
}
});
获取用户信息
uni.getUserInfo ({
提供者:“weixin”,
成功:函数(有限公司){
console.log(' - - - - - - -获取微信用户所有- - - - - -”)
console.log (JSON.stringify (infoRes.userInfo));
}
});
示例代码
& lt; !——# ifdef应用plus——比;
& lt;按钮类=" " @click=" appLogin”在应用微信授权登录& lt;/button>
& lt; !——# endif祝辞
appLogin:函数(){
uni.getProvider ({
服务:oauth,
成功:函数(res) {
console.log (res.provider);//支持微信、qq和微博等
如果(~ res.provider.indexOf (weixin)) {
uni.login ({
提供者:“weixin”,
成功:函数(loginRes) {
console.log(' - - - - - - -获取openid (unionid) - - - - - - ');
console.log (JSON.stringify (loginRes));//获取用户信息
uni.getUserInfo ({
提供者:“weixin”,
成功:函数(有限公司){
console.log(' - - - - - - -获取微信用户所有- - - - - -”);
console.log (JSON.stringify (infoRes.userInfo));
}
});
}
});
}
}
});
},
<强>获取用户基本信息
为优化用户体验,使用wx。getUserInfo接口直接弹出授权框的开发方式将逐步不再支持。从2018年4月30日开始,小程序与小游戏的体验版,开发版调用wx。getUserInfo接口,将无法弹出授权询问框,默认调用失败。正式版暂不受影响。开发者可使用以下方式获取或展示用户信息。
小程序使用按钮组件,并将开口指定为getUserInfo类型,获取用户基本信息。
参考官方:https://developers.weixin.qq.com/miniprogram/dev/component/button.html
示例代码:
& lt; !——# ifdef MP-WEIXIN祝辞
& lt;按钮类=" "开放型=癵etUserInfo @getuserinfo”=皐xGetUserInfo”withCredentials=" true "在微信授权获取用户信息& lt;/button>
& lt; !——# endif祝辞
wxGetUserInfo:函数(res) {
如果(! res.detail.iv) {
uni.showToast ({
标题:“您取消了授权,登录失败”,
图标:“没有”
});
返回错误;
}
console.log(' - - - - - - -用户授权,并获取用户基本信息和加密数据- - - - - -”)
console.log (res.detail);
},
<强>微信登录
参考官方:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html
(1)页面单。登录获取代码
(2)后端通过代码获取sessionKey, openid (unionid)等,后端调用接口如下:
https://api.weixin.qq.com/sns/jscode2session& # 63; appid=APPID&秘密=SECRET& js_code=JSCODE& grant_type=authorization_code
(3)示例代码
& lt; !——# ifdef MP-WEIXIN祝辞
& lt;按钮类=" " @click=" wxLogin”在微信登录& lt;/button>
& lt; !——# endif祝辞
wxLogin:函数(){
uni.login ({
提供者:“weixin”,
成功:函数(loginRes) {
console.log(' - - - - - - -获取代码- - - - - - -”)
console.log (loginRes.code);
wx.request ({
url: https://xxxxx的+ loginRes.code,
成功:函数(信息){
console.log(' - - - - - - -获取sessionKey, openid (unionid) - - - - - - - ')
console.log(信息);
}，
失败:函数(e) {
console.log (e)
}
})
}
});
}
微信登录状态监测
