• 小程序+egg来实现获取用户手机号


    前言:

            小程序+egg来实现获取用户手机号

    思路分析:        

    小程序

    • 获取用户信息,把用户的登录的code给后端来获得openid+session_key
    • 把获取的手机号信息给后端,后端接口解析后存库或者返回前端

    后端egg

    • 实现拿到前端的code,然后走微信后端来获取openid+session_key 给前端返回去
    • 实现拿到前端参数手机号,然后解析存库或者返回前端

    具体操作:

    前端-小程序:

    1、app.js方法里面加入登录方法(或者你的登录点击按钮)

    http.loginFun是封装的请求后台方法

    1. // 登录
    2. wx.login({
    3. success: res => {
    4. // 发送 res.code 到后台换取 openId, sessionKey, unionId
    5. let str = {
    6. js_code:res.code
    7. }
    8. http.loginFun(str).then((res)=>{
    9. this.globalData.openid = res.openid
    10. this.globalData.session_key = res.session_key
    11. }).catch(err=>{
    12. console.log(err);
    13. })
    14. }
    15. })
    app.js中
    globalData: {
      userInfo: null,
      openid: '',
      session_key: ''
    },

    2、授权获取用户手机号,并将手机号发给后端(个人小程序无法成功调起手机授权弹框)

    页面 index.wxml

    1. <button
    2. open-type="getPhoneNumber"
    3. bindgetphonenumber="onPropPhone"
    4. >
    5. 授权手机号
    6. button>

    这里是正常的手机号授权弹框,点击确定以后的返回数据

     注意:

    session_key是我们登录或者获取用户信息可以拿到的,但是iv+encryptedData 必须是点击手机号授权弹框以后才可以拿到,个人小程序这两个信息是拿不到的

    1. let globalData = app.globalData
    2. let str = {
    3. session_key: globalData.session_key,
    4. iv:e.detail.iv,
    5. encryptedData:e.detail.encryptedData,
    6. // session_key:'',
    7. // iv:'w1Q7E***************Jw',
    8. // encryptedData:'RVHjAaCrJOFH2I****************',
    9. }
    10. http.loginPhone(str).then((res)=>{
    11. console.log('获取用户手机号:');
    12. console.log(res);
    13. }).catch(err=>{
    14. console.log(err);
    15. })

    后端-egg:

     1、安装插件

    npm i crypto --save

    2、引入js配置文件,app/extend/ WXBizDataCrypt.js

    WXBizDataCrypt.js 源码内容:

    1. var crypto = require('crypto')
    2. function WXBizDataCrypt(appId, sessionKey) {
    3. this.appId = appId
    4. this.sessionKey = sessionKey
    5. }
    6. WXBizDataCrypt.prototype.decryptData = function (encryptedData, iv) {
    7. // base64 decode
    8. var sessionKey = new Buffer(this.sessionKey, 'base64')
    9. encryptedData = new Buffer(encryptedData, 'base64')
    10. iv = new Buffer(iv, 'base64')
    11. try {
    12. // 解密
    13. var decipher = crypto.createDecipheriv('aes-128-cbc', sessionKey, iv)
    14. // 设置自动 padding 为 true,删除填充补位
    15. decipher.setAutoPadding(true)
    16. var decoded = decipher.update(encryptedData, 'binary', 'utf8')
    17. decoded += decipher.final('utf8')
    18. decoded = JSON.parse(decoded)
    19. } catch (err) {
    20. throw new Error('Illegal Buffer')
    21. }
    22. if (decoded.watermark.appid !== this.appId) {
    23. throw new Error('Illegal Buffer')
    24. }
    25. return decoded
    26. }
    27. module.exports = WXBizDataCrypt

    3、新建微信接口方法 ,app/controller/wxApi/index.js

    引入配置文件与微信小程序配置:

    1. const WXBizDataCrypt = require('../../extend/WXBizDataCrypt');
    2. // 小程序的配置
    3. // 岩读
    4. const wxConfig = {
    5. appid: 'wx6a52********4e',
    6. secret: '91586*************5db9ccf43',
    7. }

    方法1源码: this.ctx.curl 是可以获取外部地址 更多信息点我

    1. async wxOpenid() {
    2. const { ctx } = this;
    3. const { js_code } = ctx.request.body;
    4. const { data } = await this.ctx.curl('https://api.weixin.qq.com/sns/jscode2session', {
    5. method: 'GET',
    6. rejectUnauthorized: false,
    7. data: {
    8. appid: wxConfig.appid, // 你的小程序的APPID
    9. secret: wxConfig.secret, // 你的小程序的secret,
    10. js_code, // wx.login 登录成功后的code
    11. },
    12. dataType: 'json',
    13. })
    14. this.ctx.body = data;
    15. }

    方法2源码:注意一点,个人小程序是 没有权限拿到手机号的,解析返回肯定是失败

    1. async wxCryptPhone() {
    2. const { ctx } = this;
    3. const { session_key, iv, encryptedData } = ctx.request.body;
    4. const pc = new WXBizDataCrypt(wxConfig.appid, session_key);
    5. // 获取到微信用户的手机号码
    6. const { phoneNumber } = pc.decryptData(encryptedData, iv);
    7. // 如果获取失败
    8. if (!phoneNumber) {
    9. this.ctx.body = {
    10. code: 500,
    11. message: '获取手机号码失败',
    12. mobile: '',
    13. params: {
    14. session_key,
    15. iv,
    16. encryptedData,
    17. },
    18. }
    19. } else {
    20. // 如果获取成功 直接加入到数据库 返回手机号 和 token给微信端
    21. this.ctx.body = {
    22. mobile: phoneNumber,
    23. code: 200,
    24. params: {
    25. session_key,
    26. iv,
    27. encryptedData,
    28. }
    29. }
    30. }
    31. }

  • 相关阅读:
    Build Speech Apps using Java 21 Crack
    使用Python随机生成数据的一些方法
    蓝桥杯每日一题2023.10.20
    [NOIP2006 提高组] 能量项链
    MicroStation二次开发问题记录(1):打开项目时自动加载dll文件
    安卓端GB28181设备接入模块如何实现实时位置订阅(MobilePosition)
    超好用!在线即可制作电子产品图册
    c++模板初阶
    数据库系统概论 --- 期末单元集
    制作翻页电子书最简单的教程来也!
  • 原文地址:https://blog.csdn.net/weixin_44727080/article/details/125798743