uniapp在微信小程序获取用户信息和openId
作者:互联网
uniapp在微信小程序获取用户信息和openId
获取用户信息
获取openId
获取用户信息
使用getUserProfile(),这个方法在每次出发的时候都会调起微信授权的那个弹出层,为什么不用getUserInfo(),微信给程序员们发公告了,不同于gerUserInfo,getUserProfile的使用方法被简化了许多,不需要在按钮属性中添加open-type,更不用规定按钮的方法,只需要:
<button @click="getUserProfile">获取用户信息</button>
这个API需要在微信开发者工具基础调试库版本2.10.4以上或微信版本7.0.9以上才可以使用。
所以使用之前在页面的onLoad()里面判断下:
onLoad() { if(uni.getUserProfile){ this.canIUseGetUserProfile = true } },
使用时的注意事项,这个方法必须由按钮直接调用,不可以在其他函数的回调中使用这个方法,否则就会报如下错误:
> errMsg: "getUserProfile:fail can only be invoked by user TAP gesture."
因此,直接调用就可以了,具体如下:
DOM:
<button v-if="canIUseGetUserProfile" class="sys_btn" @click="getUserProfile">授权</button>
JS:
getUserProfile() { //获取用户信息 uni.getUserProfile({ desc: '用户信息展示', success: (info) => { this.userInfo = info }, fail: (err) => { uni.showToast({ title: "微信登录授权失败", icon: "none" }); } }) },
关于getUserProfile()的参数和出参照文档即可: wx.getUserProfile(Object object)
获取到用户信息之后,存到vuex中供后续使用。
获取openId
在获取openID之前需要先调用login()方法获取一个登陆凭证
uni.login({ timeout: 10000, provider: 'weixin', //如果是uniapp,在这里需要标明平台的类型,支持的参数请查阅uniapp官网的uni.login()文档 success: (res) => { //登陆成功的回调 }, fail: (err) => { //登陆失败的回调 } })
在获取到登陆凭证之后,就可以调用接口获取openId和session_key等参数了。
可以在login()的success中直接使用如下代码:
uni.request({ url: 'https://api.weixin.qq.com/sns/jscode2session', method:'GET', data: { appid: 'wx xxxxxxxxxxxx, //你的小程序的APPID secret: 'xxxxxxxxxxxxx', //你的小程序的secret, js_code: 'xxxxxxxxxxxxx //wx.login 登录成功后的code }, success: (cts) => { console.log(cts); } });
直接使用微信提供的https://api.weixin.qq.com/sns/jscode2session接口,传入的参数重appid和secret需要小程序管理员到微信公众平台获取,具体详细的获取方式不作赘述。
到这里微信授权获取登陆信息的过程就结束了,可以将获取到的信息都存储到uniapp的Storage中做一个数据持久化,这样可以避免页面刷新导致的数据丢失。
————————————————
版权声明:本文为CSDN博主「ʚ杨ɞ」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_43387188/article/details/118763643
标签:uniapp,openId,微信,获取,uni,login,getUserProfile 来源: https://www.cnblogs.com/mr-hu2009/p/16436745.html