微信小程序获取用户信息

微信小程序获取用户信息,第1张

1、<open-data></open-data>:只是简单的获取头像、用户名用于显示

其中,type="userAvatarUrl"是获取用户头像,type="userNickName"是获取用户昵称,具体使用详情查看 小程序开发文档 ,此方法仅用于直接简单的展示用户信息

2、使用 <button open-type="getUserInfo">获取用户信息

在用户未授权过的情况下调用此接口,将不再出现授权d窗,会直接进入 fail 回调。

在用户已授权的情况下调用此接口,可成功获取用户信息。

1、在项目首页直接调用getUserInfo方法,若从未授权过,跳转到授权页面引导用户手动授权

需注意: bindgetuserinfo="onGetUserInfo"

用户点击该按钮时,会返回获取到的用户信息,回调的detail数据与wx.getUserInfo返回的一致,open-type="getUserInfo"时有效。

所以,不再需要写设置页提示框以及对应的设置页面,好方便啊!!!

小程序所有新进用户的昵称全部变成了“微信昵称”,当时我就

吓得我赶紧爬起来翻文档(需要代码直接往后翻)

原因就像微信所说的,很多开发者在打开小程序时就通过组件方式唤起getUserInfod窗,如果用户点击拒绝,无法使用小程序,这种做法打断了用户正常使用小程序的流程,同时也不利于小程序获取新用户。

这里我会给出Uni-app的适配代码,针对CRMEB系统进行修复,各位同学举一反三(4.13号之前发布的正式包暂不影响)

1.修改pages/users/wechat_login/index.vue中关于微信登录的按钮

<button span=""

class="bg-green btn1">微信登录

<button span=""

class="bg-green btn1">微信登录

2.默认data中添加canUseGetUserProfile: false,然后在加载页面调用的方法里面增加uni.getUserProfile的判断,是否显示新的按钮。

canUseGetUserProfile: false

if (uni.getUserProfile) {

this.canUseGetUserProfile = true

}

3.方法中新增getUserProfile方法用户获取用户信息

//小程序授权api替换 getUserInfo

getUserProfile() {

uni.showLoading({

title: '正在登录中'

})

let self = this

Routine.getUserProfile()

.then(res =>{

let userInfo = res.userInfo

userInfo.code = this.code

userInfo.spread_spid = app.globalData.spid//获取推广人ID

userInfo.spread_code = app.globalData.code//获取推广人分享二维码ID

Routine.authUserInfo(userInfo)

.then(res =>{

if (res.data.key !== undefined &&res.data.key) {

uni.hideLoading()

self.authKey = res.data.key

self.isPhoneBox = true

} else {

uni.hideLoading()

let time = res.data.expires_time - self.$Cache.time()

self.$store.commit('LOGIN', {

token: res.data.token,

time: time

})

this.getUserInfo()

}

})

.catch(res =>{

uni.hideLoading()

uni.showToast({

title: res.msg,

icon: 'none',

duration: 2000

})

})

})

.catch(res =>{

uni.hideLoading()

})

},

4.然后在libs/routine.js中增加getUserProfile方法

/**

* 新版小程序获取用户信息 2021 4.13微信小程序开始正式启用

*/

getUserProfile(code) {

return new Promise((resolve, reject) =>{

uni.getUserProfile({

lang: 'zh_CN',

success(user) {

if (code) user.code = code

resolve({

userInfo: user,

islogin: false

})

},

fail(res) {

reject(res)

}

})

})

}

这里要注意

if (!isset($userInfoCong['openid'])) {

throw new ValidateException('openid获取失败')

}

if (!isset($userInfoCong['openid'])) {

throw new ValidateException('openid获取失败')

}

userInfo['unionId'] = isset( userInfo [′ unionId ′]= isset (userInfoCong['unionid']) ? $userInfoCong['unionid'] : ''

userInfo['openId'] = userInfo [′ openId ′]=openid = $userInfoCong['openid']

修复完成之后重新编译小程序就可以解决授权之后微信用户的问题啦。

公司业务开展,最近完成了一个微信小程序的开发。场景是这样,同一微信开放平台下拥有相同主体的APP和微信小程序来完成同样的业务,用户进入app或者微信小程序时必须获取用户的unionid来确认当前的用户身份,完成登录。小程序“获取用户信息”api(getUserInfo)的调用方式和之前相比有了较大更新,优雅的实现用户授权和登录非常重要,以下是我在微信小程序授权登录相关流程在开发时候的实现思路和总结,分享如下。

说明:

你可以简单的理解为

如果开发者在多个移动应用、网站应用和公众帐号之间有统一用户账号的需求,需要前往微信开放平台(open.weixin.qq.com)绑定公众号后,便可利用UnionID机制来满足上述需求。

用户在开放平台的唯一标识符

你可以简单的理解为:

微信针对不同的用户在不同的应用下都有唯一的一个openId, 但是要想确定用户是不是同一个用户,就需要靠unionid来区分。一般自己的后台都会有自己的一个用户表,每个用户有不同的userid。也就是说同一个用户在同一个微信开放平台下的相同主体的应用对应着相同的userid,unionid以及不同的openid。所以在用户登录进来的时候,我们只能靠微信返回给我们的unionid去判断是不是同一个用户,在去关联我们的用户表,拿到对应的userid。

绑定了开发者帐号的小程序,可以通过下面3种途径获取UnionID。

当用户满足条件2和3时,开发者可以直接通过wx.login获取到该用户的unionid, 否则必须调用接口 wx.getUserInfo ,额外需要注意的事就是妥善处理用户拒绝授权的情况。

在真实的业务场景中,我们希望,用户进入小程序时,未登录情况下可以正常浏览商品,对小程序有个基本的认知,不要直接d出框要求用户授权,否则会干扰用户,导致新用户的流失,当用户需要使用一些高级功能和场景,这个时候再去要求用户授权,这样用户授权的几率会大大提高。

将登录的逻辑封装ajax

流程:

封装的意义

不再关注当前接口是否需要登录,用户是否已授权,所有请求直接调用 ajax() ,在必要的时候完成一切登录以及授权流程。小程序入口页面增加,业务拓展的时候,你只需要专注于业务实现。

参考资料


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/yw/11788766.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-18
下一篇2023-05-18

发表评论

登录后才能评论

评论列表(0条)

    保存