微信小程序获取用户openId、手机号

对于第一次实现小程序获取用户手机号、用户信息功能的程序猿来说，有一个着手的思路可以事半功倍。本文可以给你提供这个思路，助你快速准确完成需求。

调用wx.login，在成功回调中，拿自己小程序的appId、secret请求接口 url: ' https://api.weixin.qq.com/sns/jscode2session?appid=' + appId + '&secret=' + secret + '&js_code=' +code + '&grant_type=authorization_code',请求成功即可拿到openid和session-key

小程序的appId必须要在微信公众平台完成微信认证（里面需要上传一些企业的一些证件和信息）才能有获取用户手机号的权限

最后拿用户的获取到的e.detail.iv、和e.detail.encryptedData（加密的手机号）和前面拿到过的session-key传给后台，交给后台解密即可

具体解密规则参考官方文档：( https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html )

一个很常用的功能，但是我还是发现有一些需要注意的地方在里面，简单记录一下。

第一个问题就是这个 button 组件需要添加 open-type 属性，并指定为 getUserInfo 类型，来获取用户基本信息。还有另外一种做法，具体可以参考 官方文档的说明 。

放一个动图哈哈哈

js 部分就是响应点击事件，使用 api wx.getUserInfo(Object object)

获取用户信息，注意传递给 wx.getUserInfo 的是一个字典其中包含了两个函数分别作为成功和失败的回调函数（callback function）

注意 this 的指代对象发生了变化，最开始的this是指代 Page() 构造出来的对象，在函数里面使用 this 会说未指定，所以我们使用了 that 承接一下，这也算传统艺能咯。

另外一点：获取用户信息时会自动d出一个对话框问用户是否提供信息，这个d窗只d出一次，如果用户点击了拒绝后来又想改为允许，可以使用 wx.openSetting({})

除了可以获取用户的昵称之外还有很多信息可以得到，还有一个比较常用的就是用户头像了也就是 res.userInfoavatarUrl 。

---