下面是详细讲解“微信小程序获取手机号的踩坑记录”的完整攻略。

微信小程序获取手机号的踩坑记录

问题描述

在微信小程序中，如何获取用户的手机号？我们可以通过调用 wx.login 接口获取用户的 code，然后在后端服务器上调用微信提供的 session_key 接口获取到用户的 openid 和 session_key，最后使用 session_key 来解密用户的手机号码。但是在实际开发中，我们可能会遇到以下问题：

1. 如何在前端将 code 发送到后端服务器？
2. 如何在后端服务器中使用 session_key 解密用户的手机号？
3. 当用户拒绝授权手机号时，如何处理？

下面将逐一解答这些问题。

问题一：如何在前端将 code 发送到后端服务器？

在微信小程序中，我们可以使用 wx.login 接口获取用户的登录凭证 code，然后将 code 发送到后端服务器进行处理。具体代码如下：

// 在前端中调用 wx.login 接口获取 code
wx.login({
  success(res) {
    if (res.code) {
      wx.request({
        url: 'https://example.com/login',
        data: {
          code: res.code
        },
        success(res) {
          console.log(res.data)
        }
      })
    } else {
      console.log('登录失败！' + res.errMsg)
    }
  }
})

当用户点击“获取手机号”按钮时，我们可以先调用 wx.login 接口获取 code，然后将 code 发送到后端服务器，后端服务器再通过微信提供的接口获取 session_key、openid 等信息，最后返回给前端。

问题二：如何在后端服务器中使用 session_key 解密用户的手机号？

获取到用户的 session_key 后，我们就可以使用解密算法来解密用户的手机号。具体步骤如下：

1. 对加密数据进行 Base64 解码，得到加密后的数据 encryptedData。
2. 对 session_key 进行 Base64 解码，得到解密密钥 aesKey。
3. 对 IV（初始向量） 进行 Base64 解码，得到解密算法的初始向量 iv。
4. 使用解密密钥 aesKey 和初始向量 iv，进行 AES-128-CBC 解密，得到原始数据。

具体代码如下：

// 在后端服务器中使用 Node.js 的 crypto 库进行加解密操作
const crypto = require('crypto')

const sessionKey = 'xxxxxxxxxxxxxx' // 换成实际的 session_key
const encryptedData = 'xxxxxxxxxxxxxx' // 换成实际的加密后的数据
const iv = 'xxxxxxxxxxxxxx' // 换成实际的初始向量

const sessionKeyBuffer = new Buffer.from(sessionKey, 'base64')
const encryptedDataBuffer = new Buffer.from(encryptedData, 'base64')
const ivBuffer = new Buffer.from(iv, 'base64')

const decipher = crypto.createDecipheriv('aes-128-cbc', sessionKeyBuffer, ivBuffer)
let decoded = decipher.update(encryptedDataBuffer, 'binary', 'utf8')
decoded += decipher.final('utf8')

console.log(decoded) // 输出用户的手机号

注意，上述代码中的算法和密钥需要与前端中加密数据使用的算法和密钥保持一致。

问题三：当用户拒绝授权手机号时，如何处理？

在小程序中，当用户拒绝授权手机号时，我们可以根据返回的 errMsg 字段来判断用户是否授权成功。具体代码如下：

wx.getPhoneNumber({
  success(res) {
    console.log(res.encryptedData) // 获取加密后的手机号
  },
  fail(res) {
    if (res.errMsg === 'getPhoneNumber:fail user deny') {
      console.log('用户拒绝授权')
    } else {
      console.log('获取手机号失败！' + res.errMsg)
    }
  }
})

当用户拒绝授权时，我们可以给用户提示“您需要授权手机号才能使用该功能”，并提供相应的引导。如果用户授权失败，也需要给出相应的提示。

示例说明

下面给出两个示例说明：

示例一：获取用户手机号码

1. 用户点击“获取手机号”按钮。
2. 前端调用 wx.login 接口，获取 code。
3. 前端将 code 发送到后端服务器，后端服务器通过微信提供的接口获取 session_key、openid 等信息，最后返回给前端。
4. 前端显示一个页面，提示用户“请授权手机号码”，并提供“去授权”的按钮。
5. 用户点击“去授权”的按钮，前端调用 wx.getPhoneNumber 接口，等待用户授权。
6. 用户授权后，前端获取加密后的手机号数据。
7. 前端将加密数据发送到后端服务器，后端服务器使用解密算法解密出用户的手机号码。
8. 后端服务器将手机号码返回给前端，前端显示用户的手机号码。

示例二：用户拒绝授权手机号码

1. 用户点击“获取手机号”按钮。
2. 前端调用 wx.login 接口，获取 code。
3. 前端将 code 发送到后端服务器，后端服务器通过微信提供的接口获取 session_key、openid 等信息，最后返回给前端。
4. 前端显示一个页面，提示用户“请授权手机号码”，并提供“去授权”的按钮。
5. 用户点击“去授权”的按钮，前端调用 wx.getPhoneNumber 接口，等待用户授权。
6. 用户拒绝授权后，前端判断授权失败，并给出相应的提示。
7. 用户可以重新点击“获取手机号”按钮，重新进行授权。