微信公众号-小程序实现人脸核身(人脸识别)

6,504 阅读3分钟

大前提:由于人脸核身功能涉及到用户的敏感、隐私信息,因此调用此接口的小程序,需要满足一定的条件。开展的业务也需要是国家相关法规、政策规定的需要“实名办理”的相关业务;仅支持二代身份证的大陆居民;具体介绍看文档:developers.weixin.qq.com/community/b…

笔者业务场景:使用微信开发者工具,点击button按钮,调取微信小程序人脸核身的接口,微信小程序人脸核身接口需要传入姓名和身份证号码(人脸识别的界面是调取接口后出现的,不用写静态页面,直接写触发事件调接口;微信会拿用户人脸信息与微信的api人脸库对比,认证通过返回认证人信息),比对成功后接口返回加密后人员信息,传给后端,后端去调微信接口解密。

官方文档:developers.weixin.qq.com/community/b…

一. 微信小程序开通人脸核身权限

登录微信公众平台mp.weixin.qq.com/ 功能-人脸识别 (按照填写申请)

注:开发管理-接口设置已经取消了,在功能-人脸识别中能看到调接口的数据。

二. 审核通过后找到AppID配置到项目

1.开发设置-开发者ID;复制AppID AppID.png 2. 打开微信开发者工具Stable:找到project.config.json,将appid粘贴过来。 image.png

三. 调取接口拿到人员信息,传给后端。

1.笔者是点击button按钮触发调取接口;先展示下button部分的代码。

①app.json中添加button,在pages中自动生成button文件

image.png

image.png

②pages/button/button.wxml代码
<view class="usertitle">
  <div class='titleText'>人脸识别认证</div>
</view>
<form bindsubmit="facialRecognitionVerify">
  <view class='btnToFaceCheck'>
    <button class='btnToFaceCheck' formType="submit">
      <text>点击此处开始人脸识别认证</text>
    </button>
  </view>
</form>

③ pages/button/button.js代码

首先调取检测设备是否支持人脸识别接口,支持再调取人脸识别接口,人脸识别接口必穿的参数有两种形式:第一是name和idCardNumber(看代码),第二是传加密后的姓名和身份证号码,使用userIDKey:" "; 注:传入的参数姓名和身份证都是string类型的,可以先写死尝试;仔细看注释。 检查设备是否支持人脸检测错误码: image.png

Page({
    onLoad: function (options) {
      var that = this;
      that.setData({faceCheckData:options});
    },
  facialRecognitionVerify: function () {
    // 1.检测设备是否支持人脸识别
      checkIsSupportFacialRecognition({
        checkAliveType: 2,
        success: function(res) {
          if (res.errCode === 0 || res.errMsg === "checkIsSupportFacialRecognition:ok") {
            // 2.调用人脸识别
                wx.startFacialRecognitionVerify({
                   name: "传入参数", //姓名
                   idCardNumber: "传入参数", //身份证号
                   //人脸识别成功回调通知
                  success (res) {
                  var verifyResult = res.verifyResult;
                  console.log(verifyResult)
                },
                //人脸识别失败的回调通知
                    'fail': function (res) {
                        console.log(res,"失败");
                        wx.showModal({
                          title: '提示',
                          showCancel: false,
                          content: "人脸识别失败!" + res.errCode+","+res.errMsg,
                          success: function (res) {
                            if (res.confirm) {
                                wx.navigateTo()
                            }
                          }
                        });
                    }
                   });
        return;
          }
          wx.showToast('微信版本过低,暂时无法使用此功能,请升级微信最新版本')
        },
        fail: res => {
          wx.showToast('微信版本过低,暂时无法使用此功能,请升级微信最新版本')
        }
      });
    }
    })
④点击真机调试-二维码真机调试-出现静态页面-进入人脸识别-出现人脸识别框(跟其他软件人脸认证静态页面一样)-验证-通过后显示人脸识别成功。

image.png

image.png image.png

image.png

⑤人脸识别通过返回的人员加密信息。

image.png

⑥将res.verifyResult的数据传给后端。
  1. 错误码请参考官方文档。 前端结束,拉闸!