微信小程序获取用户信息方案介绍(附可用DEMO) - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

微信小程序获取用户信息方案介绍(附可用DEMO)

发表时间:2021-1-5

发布人:葵宇科技

浏览次数:65

背景

小程序一个比较重要的能力就是获取用户信息,也就是使用 wx.getUserInfo 接口。我们发现几乎所有的小程序都会调用这个接口。虽然我们在设计文档上有提出最好的设计是在真正要用户信息的情况下才去获取用户信息,不过很多开发者并没有按照我们的期望去做,导致用户在使用的时候有很多困扰。

归结起来有几点:

  • 开发者在首页直接调用 wx.getUserInfo 进行授权,弹框有会使得一部分用户放弃小程序的使用。

  • 开发者没有处理用户拒绝弹框的情况,有部分小程序强制要求用户授权头像昵称等信息才能继续使用小程序。

  • 用户没有很好的方式重新授权,虽然在前几个版本我们增加了设置页面可以让用户选择重新授权,但是操作还是不够便捷。

  • 开发者希望进到首页就获取到用户的unionId,以便和之前已经关注了公众号的用户画像关联起来。

  • 开发者默认将 wx.loginwx.getUserInfo 绑定使用,这个是由于我们一开始的设计缺陷和实例代码导致: getUserInfo必须通过wx.login 在后台生成session_key 后才能调用。

为了解决以上几点,我们更新了三个能力:

  1. 使用组件来获取用户信息,用户拒绝授权后也可以重新弹窗再次授权

  2. 若用户满足一定条件(下文有详细介绍),则可以用wx.login 获取到的code直接换到unionId

  3. wx.getUserInfo 不依赖 wx.login 就能调用得到数据。

获取用户信息组件介绍

组件变化:

  • open-type 属性增加 getUserInfo :用户点击时候会触发 bindgetuserinfo 事件。

  • 新增事件 bindgetuserinfo :当 open-typegetUserInfo 时,用户点击会触发。可以从事件返回参数的detail字段中获取到和wx.getUserInfo 返回参数相同的数据。

示例:

<button open-type="getUserInfo" bindgetuserinfo="userInfoHandler"> Click me button>

wx.getUserInfo 不同之处在于:

  • API wx.getUserInfo 只会弹一次框,用户拒绝授权之后,再次调用将不会弹框

  • 组件 由于是用户主动触发,不受弹框次数限制,只要用户没有授权,都会再次弹框


直接获取unionId

考虑很多场景下,业务方申请userinfo授权主要为了获取unionid。我们鼓励开发者在不骚扰用户的情况下合理获得unionid,而仅在必要时才向用户弹窗申请使用昵称头像。为此,凡使用“获取用户信息组件”获取用户昵称头像的小程序,在满足以下全部条件时,将可以静默获得unionid。

  1. 在微信开放平台下存在同主体的App、公众号、小程序。

  2. 用户关注了某个相同主体公众号,或曾经在某个相同主体App、公众号上进行过微信登录授权。


getUserInfo 和 login

很多开发者会把login和getUserInfo捆绑调用当成登录使用,其实login已经可以完成登录,可以建立账号体系了,getUserInfo只是获取额外的用户信息。

在login获取到code,然后发送到开发者后端,开发者后端再通过接口去微信后端换取到openid和sessionKey(并且现在会将unionid也一并返回)之后,然后把3rd_session返回给前端,就已经完成登录行为。而login行为是静默,不必授权的,不会对用户造成骚扰。

getUserInfo只是为了提供更优质的服务而存在,比如展示头像昵称,判断性别,通过unionId和其他公众号上已有的用户画像结合起来提供历史数据。所以不必在刚刚进入小程序的时候就强制要求授权。

推荐使用方法

  1. 调用wx.login 获取code,然后从微信后端换取到sessionKey,用于解密getUserInfo返回的敏感数据。

  2. 使用wx.getSetting 获取用户的授权情况

    1. 如果用户已经授权,直接调用 API wx.getUserInfo 获取用户最新的信息

    2. 用户未授权,在界面中显示一个按钮提示用户登入,当用户点击并授权后就获取到用户的最新信息。

  3. 获取到用户数据后可以进行展示或者发送给自己的后端。

文档中的quickStart已经更新

特别注意

为了给用户提供更好的小程序环境,我们约定在一段时间后(具体时间会做通知),若还出现以下情况(包括但不限于),将无法通过审核

  1. 初次打开小程序就弹框授权用户信息

  2. 未处理用户拒绝授权的情况

  3. 强制要求用户授权

已经上线的小程序不会受到影响。
可用demo

wx-getUserInfo以及getOpenID.rar

相关案例查看更多