微信小程序纯前端解密获取用户手机号码_微信小程序前端解密获取用户手机号

微信小程序纯前端解密获取用户手机号码

- 目前微信小程序经过改版后wx.getPhoneNumber

返回的是加密信息，需要解密才可以拿到明文，分 享纯前端解密手机号的踩坑记录

1. 引入解密包 解密包下载 cryptjs解密包下载
2. 将资源下载解密之后放在合适的位置比如utils中，并创建RdWXBizDataCrypt.js文件
   
   在新建的js文件中写入以下代码：

var Crypto = require('./cryptojs/cryptojs.js').Crypto;
var app = getApp();
 
function RdWXBizDataCrypt(appId, sessionKey) {
	this.appId = appId
	this.sessionKey = sessionKey
}
RdWXBizDataCrypt.prototype.decryptData = function(encryptedData, iv) {
	// base64 decode ：使用 CryptoJS 中 Crypto.util.base64ToBytes()进行 base64解码
	var encryptedData = Crypto.util.base64ToBytes(encryptedData)
	// console.log(sessionKey)
	var key = Crypto.util.base64ToBytes(this.sessionKey);
	var iv = Crypto.util.base64ToBytes(iv);
    // 对称解密使用的算法为 AES-128-CBC，数据采用PKCS#7填充
    var mode = new Crypto.mode.CBC(Crypto.pad.pkcs7);
    
	try {
		// 解密
		var bytes = Crypto.AES.decrypt(encryptedData, key, {
			asBpytes: true,
			iv: iv,
			mode: mode
		});
		var decryptResult = JSON.parse(bytes);
	} catch (err) {
		console.log(err)
    }
	if (decryptResult.watermark.appid !== this.appId) {
		console.log(err)
	}
	return decryptResult
}
export default RdWXBizDataCrypt

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

3. 在需要使用的页面进行引入（根据自己的实际路径进行操作）

import RdWXBizDataCrypt from '../../utils/RdWXBizDataCrypt.js';
1

wxml:

<button class="scan" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">
   获取手机号
</button>
1
2
3

js:

getPhoneNumber(e) {
        try {
            if (!e.detail) {
                return;
              }
               wx.login({
            success: async res => {
              // 发送 res.code 到服务端换取 openId, sessionKey, unionId然后自己做存储 这个方发是去后端获取，也可前段自行调取wx提供的接口换取这些信息，方式不同而已
              await wxLogin(res.code)
              //使用最新的sessionkey进行后面操作。这一步更新sessionKey（重要，否则将可能报错）
              let phone = e.detail.encryptedData;
              let iv = e.detail.iv;
              let appId = '--你的小程序appid--';
              let session_key = '你的sessionkey';
              const pc = new RdWXBizDataCrypt(appId, session_key);
              const data = pc.decryptData(phone, iv);
              console.log(data,'用户手机号信息')
              }).catch(err => {
                  console.log(err)
              })
              }
        } catch (error) {
            console.log(error)
            }
          })
        }
      }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

至此前端解密手机号就完成