Vue 简单人脸识别

做项目碰到的,刚开始一头雾水,不知从何开始,钻研好几天有了简单的思路。

人脸识别的简单伪代码:

1.要识别人脸就要调用摄像头

2.识别就要和后台存储的数据进行对比

主要代码:

        

// 调用摄像头

    callCamera() {

      this.$refs.mypic.style.opacity = "1";

      // H5调用电脑摄像头API

      navigator.mediaDevices

        .getUserMedia({

          video: true,

        })

        .then((success) => {

          this.isnotbtn = true;

          // 摄像头开启成功

          this.$refs["video"].srcObject = success;

          // 实时拍照效果

          this.$refs["video"].play();

        })

        .catch((error) => {

          console.error("摄像头开启失败,请检查摄像头是否可用!");

        });

      this.$emit("callCamera", this.isnotbtn);

    },

// 拍照

    photograph() {

      this.isnotcheckall = true;

      this.arr++;

      this.onecanvas = this.onecanvas + this.arr;

      this.domains.push(this.onecanvas);

      let dataimage = this.domains[this.domains.length - 1];

      this.$nextTick(() => {

        this.$refs[dataimage][0]

          .getContext("2d")

          .drawImage(

            this.$refs["video"],

            0,

            0,

            this.imagheight,

            this.imagwidth

          );

        this.icnspinimages.push(

          this.$refs[dataimage][0].toDataURL("image/jpeg", 0.7)

        );

        this.getpicurl();

      });

    },

最重要的就是这些,最后根据拍照后调用的函数对比后台数据。

如果人脸识别失败,还可以通过手动输入身份证号,或是其他重要数据,进行补救登录。

你可能感兴趣的:(vue零散总结,vue.js,前端,javascript)