微信小程序之人脸识别（2）

最新推荐文章于 2025-10-25 11:24:10 发布

原创

最新推荐文章于 2025-10-25 11:24:10 发布 · 4.4k 阅读

16 ·

CC 4.0 BY-SA版权

这篇博客介绍了微信小程序中的人脸识别登录功能。用户拍照后，照片与人脸库进行比对，当相似度score超过95%则视为识别成功。文章展示了wxml的camera组件使用，js代码中利用wx.createCameraContext接口控制相机，并通过wx.uploadFile上传图片。后台控制器接收到图片后，调用人脸识别接口，根据返回的score判断识别结果，若成功则根据user_id查询用户信息。

上一篇博客已经将人脸的照片上传到了人脸库，接下来需要做的就是登录时拍照保存并与人脸库的图片进行对比，当score大于95即识别成功！

下面是wxml代码，主要用的就是camera组件，点击按钮拍照并保存，利用开关来控制使用前置还是后置摄像头。

<!--pages/camera/camera.wxml-->
<camera device-position="{
  
  {switch}}" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>
<button type="primary" bindtap="takePhoto" class='btn'>刷脸登录</button>
<view class='weui-cell_ft switch'>
    <switch checked bindchange='switch1Change'></switch>
</view>

下面是js代码。wx.createCameraContext（）接口的作用是创建并返回camera组件上下文cameraContext对象，cameraContext与页面的camera组件绑定，通过它可以控制对应的camera组件。拍照以后再访问wx.uploadFile()接口将图片保存到服务器中方便使用。返回的数据中有score即可判断是否识别成功。

Page({
  /**
   * 页面的初始数据
   */
  data: {
    src:null,
  },
  switch1Change: function (e) {
    if (e.detail.value) {
      this.setData({ switch: 'front' })
    } else {
      this.setData({ switch: 'back' })