building_tx_mini_wx_rebuild/components/catchFace/index.js

const { throttle } = require("./util/throttle");

// components/catchFace/index.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    countDown: {
      type: Number,
      value: 4
    },
    fake: {
        type: Boolean,
        value: true
      }
  },

  /**
   * 组件的初始数据
   */
  data: {
    tip: '请保持人脸在正中心位置',
    src: null,
    state: false,
    timer: null,
    countNumber: null,
    interval: null
  },

  /**
   * 组件的方法列表
   */
  methods: {
    // 打开摄像机监听器
    async listeningFace() {
      const that = this;
      await wx.initFaceDetect()
      const camera = wx.createCameraContext()
      const listener = camera.onCameraFrame((frame) => {
        wx.faceDetect({
          frameBuffer: frame.data,
          width: frame.width,
          height: frame.height,
          enablePoint: true,
          enableConf: true,
          enableAngle: true,
          enableMultiFace: false,
          success: (faceData) => {
            that.judgeFace(faceData);
          },
          fail() {
            that.data.state = false
            that.setData({
              tip: '未检测到人脸',
            })
          },
          complete() {
            that.judgeMove(camera, listener, that.data.countDown)
          }
        })
      })
      listener.start()
    },
    //判断人脸是否符合标准
    judgeFace: throttle(function(faceData) {
      if(faceData.detectRect.height < 170) {
        this.setData({
          tip: '请靠近一点'
        });
        this.data.state = false;
        return 
      }
      if(faceData.detectRect.height > 220) {
        this.setData({
          tip: '请离远一点'
        });
        this.data.state = false;
        return 
      }
      if(faceData.confArray.global < 0.8) {
        this.setData({
          tip: '请勿遮挡脸部'
        });
        this.data.state = false;
        return 
      }
      if(faceData.confArray.leftEye < 0.8 || faceData.confArray.rightEye < 0.8) {
        this.setData({
          tip: '请勿遮挡眼睛'
        });
        this.data.state = false;
        return 
      }
      if(Math.abs(faceData.angleArray.pitch) > 0.2 || Math.abs(faceData.angleArray.yaw) > 0.2 ||  Math.abs(faceData.angleArray.roll) > 0.1) {
        this.setData({
          tip: '请正视屏幕'
        });
        this.data.state = false;
        return 
      }
      this.setData({
        tip: '请保持不动，正在抓拍中'
      });
      this.data.state = true;
      return 
    },500),
    //判断人脸是否相对静止，防止拍的照片模糊
    judgeMove(camera, listener, duration) {
      if(this.data.state === true ) {
        if(this.data.timer === null) {
          this.countDown(duration)
          this.data.timer = setTimeout(() => {
            this.doTakePhoto(camera, listener);
          }, duration*1000)
        }
      } else {
        clearTimeout(this.data.timer)
        clearInterval(this.data.interval);
        this.data.timer = null
        this.data.interval = null
        this.setData({
          countNumber: null
        })
      }
    },
    //抓拍倒计时
    countDown(count) {    
      this.data.interval = setInterval(() => {
        if(count <= 0) {
          clearInterval(this.data.interval);
          this.data.interval = null
          this.setData({
            countNumber: null
          })
        }else {
          count--
          this.setData({
            countNumber: count
          })
        }
      }, 1000);
    },
    //抓拍照片
    doTakePhoto(camera, listener) {
      const that = this;
      camera.takePhoto({
        success(photo) {
          that.setData({
            src: photo.tempImagePath,
            tip: '抓拍成功',
            countNumber: null
          });
          listener.stop();
          that.triggerEvent('getPhoto', photo.tempImagePath)
        },
        fail(err) {
          console.log(err)
        }
      });
    },
  },
  
  //钩子
  lifetimes: {
    attached: function() {
      this.listeningFace();
      
    },
    detached: function() {

    },
  },
})