小程序获取手机号码解密偶尔会失败

问题描述

同事在做小程序开发时，有获取用户手机号的需求，代码运行都比较正常，只是手机号有时能解密得到，有时又不能解密得到。（有几率第一次获取手机号码失败，但是随后一次又能成功）流程如下： 用户点击—获取手机号码—按钮后 触发其绑定的获取手机号的函数 getPhoneNumber
反应到用户界面上是如下图这样的效果

观看他的小程序端代码，下面是 getPhoneNumber 的相关代码截图：
我做了一些修改，下划线部分是我添加的，注释了他的wx.login 调用。后面会说明。

/index/wechat/getMobile 是原本的请求地址。data参数原本只包含 iv 和 encryptedData。

再看看服务器PHP代码片段（为了表示友好，无关代码擦去了）：

getMobile 就是用wx.login拿到的code 去微信服务器换 sessionKey ，然后再通过 sessionKey和 前端传递的参数 iv 、encryptedData 做解密操作。最后返回解密后的数据，其中包含用户的手机号码。

我们可以看到标记的代码（注释的部分是我修改过的），他是在getPhoneNumber 函数里面调用了wx.login() 。问题便是出在这里了。

流程知悉

首先我们得熟悉小程序获取用户手机号的整个流程。这里默认大家已经知悉。
如果不熟悉可以自行查阅文档。（文档链接：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html）
如下图：

标红的部分应该认真细看。最好也看看小程序登录的流程图。

问题分析

熟悉流程后，不难发现。获取手机号码是需要先 wx.login() 的。
而之前的流程是在getPhoneNumber里面去调用wx.login();
所以这里出现了问题，getPhoneNumber能获取到 iv 和 encryptedData 。问题是，这里的 iv 和 encryptedData 都是在调用wx.login 之前的。
而 wx.login 是有可能会刷新用户的登录态的。也就是说，不是每次都会刷新登录态，
一旦刷新登录态，用刷新登录态之前的 iv 和 encryptedData 去和服务器的 sessionKey 做手机号码的解密操作，就会失败。

解决办法

正常流程如下：
先调用wx.login()登录，在登录前可以调用wx.checkSession() 检查用户登录态

wx.checkSession({
  success () {
    //session_key 未过期，并且在本生命周期一直有效
  },
  fail () {
    // session_key 已经失效，需要重新执行登录流程
    wx.login() //重新登录
  }
})

然后再做相关业务操作。
这里为了省事（小程序就一个获取手机号的业务操作，其他页面套用的手机网页），我把sessionKey直接存到本地了。不建议大家这样做，官方推荐也是在自己服务器保 sessionKey。
除非大家有我这么充分的理由，且小程序核心业务逻辑没有。只是一个架子。
看调整后的代码（小程序app.js 中的代码）：
将登录的时机放在了app.js的 onlaunch 里面 ，登录前检查用户登录态，登录后将sessionKey缓存到本地。
之后再将 iv 和 encryptedData 以及 sessionKey 提交给服务器解密返回用户手机号码。


以上都只截图了相关代码片段，不保证代码完整性。

至于标准流程。请参考小程序登录的流程图
文档：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html