微信小程序使用face++实现人脸识别登录注册

2023-11-13

Face++是一个 人工智能开放平台,要使用它我们得先注册并进入控制台创建API Key,这是前提。

平台网址:https://www.faceplusplus.com.cn

整个项目代码我已经上传到网盘。

链接:https://pan.baidu.com/s/156C64y-CO0PNw1jWmfgqcw
提取码:o3jb

一、编写微信小程序界面

界面中有一个相机和两个按钮,本文只管功能实现界面没有美化,在IDE中相机可能打不开是空白的,在真机上是可以的,代码如下。

index.wxml:

<!--index.wxml-->
<view class="container">
<camera device-position="front" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>
<view class="test">
<button type="primary" bindtap="register">拍照注册</button>
<button id="verify" type="primary" bindtap="verify">拍照验证</button>
</view>
</view>

index.wxss:

/**index.wxss**/
.test{
   display: flex;
  flex-direction:row;
}
#login{
  margin-left: 10px;
}

二、功能实现

1、创建脸集(FaceSet)

这是一组用来管理人脸(Face)或人脸集合(FaceSet)的API。通过这组API,您可以实现查询Face属性、新建FaceSet、删除FaceSet、添加Face到FaceSet等功能。FaceSet能够存储的 人脸数量10000个。

注意:只创建一次,当脸集容量满了可以再创建

请求代码如下:

wx.request({
              url: 'https://api-cn.faceplusplus.com/facepp/v3/faceset/create',//请求接口
              method: 'post',
              data: {
                'api_key': '',//请填写你创建的api_key 
                'api_secret': '',//请填写你的api_secret
                'outer_id':'15185672300',//账号下全局唯一的 FaceSet 自己自定义,后面要用到
              },
              header: {
                'content-type': 'application/x-www-form-urlencoded',
              },
              success(res) {
                console.log(res.data)//打印
              },fail:function(e){
                wx.showModal({
                  title: '提示',
                  content: '创建失败',
                  showCancel: false
                })
              },complete:function(){
                
              }
            })

请求后打印如下信息:

 

2、人脸注册、登录实现

请看代码详细注释

index.js:

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {

  },

  onLoad: function () {

  }, //人脸注册按钮触发此函数
  register: function () {
    const ctx = wx.createCameraContext() //创建相机上下文
    ctx.takePhoto({
      quality: 'high', //获取原图
      success: (res) => {
        this.setData({
          src: res.tempImagePath //得到拍照后的图片地址
        });
        wx.showToast({
          icon: "loading",
          title: "正在上传中。。。"
        });
        console.log(res);

        var that = this;

        wx.uploadFile({ //上传图片到接口,获取人脸唯一标识,face_token

          url: "https://api-cn.faceplusplus.com/facepp/v3/detect",
          filePath: that.data.src, //刚才拍照的图片地址
          name: 'image_file', //图片的字段名和接口的字段要对应上
          header: {
            "Content-Type": "multipart/form-data" //必须用此header
          },
          formData: {
            'api_key': '3f7C895Stwfxw5yAfFQcrnn5rJ_WBXcD',//请填写你创建的 apikey
            'api_secret': 'R9Y-UKyUZOkXeWYEsXcgLVcsdPFlbiGV',//请填写你的api_secret

          },
          success: function (res) {
            console.log(res);

            var obj = JSON.parse(res.data); //转换成json格式不然解析不了

            if (obj['faces'][0] == null || obj['faces'][0] == '') { //根据反回的数据判断是是否检测到人脸
              wx.showModal({
                title: '提示',
                content: '检测不到人脸',
                showCancel: true
              })
              return;
            } else {
              that.setData({
                face_token: obj['faces'][0]['face_token'],//获取得到的人脸标识
              });


              //把新注册的人脸与脸集进行对比获得confidence值 这个值大于80我们就认为人脸集中有这个人
              wx.request({
                url: 'https://api-cn.faceplusplus.com/facepp/v3/search',//接口
                method: 'post',
                data: {
                  'api_key': '3f7C895Stwfxw5yAfFQcrnn5rJ_WBXcD',//请填写你创建的 apikey
                  'api_secret': 'R9Y-UKyUZOkXeWYEsXcgLVcsdPFlbiGV',//请填写你的api_secret
                  'face_token': that.data.face_token,//传入face_token和脸集中的数据比对
                  'outer_id': '15185672300', //脸集唯一标识,就是上面我们创建的脸集
                  'return_result_count': '1'//返回一条匹配数据,范围1-5
                },
                header: {
                  'content-type': 'application/x-www-form-urlencoded',
                },
                success(res) {
                  console.log(res.data)

                  //var obj = JSON.parse(res.data);
                  that.setData({
                    confidence: res.data['results'][0]['confidence'] //对比得到的可信值
                  });
                },
                fail: function (e) {
                  wx.showModal({
                    title: '提示',
                    content: '注册失败',
                    showCancel: false
                  })
                },
                complete: function () {
                  wx.hideToast();
                }
              })
              if (that.data.confidence < 80) { //可信值小于80我们就把他加到脸集中
                //把face_token添加到脸集中
                wx.request({
                  url: 'https://api-cn.faceplusplus.com/facepp/v3/faceset/addface',//添加到脸集的接口
                  method: 'post',
                  data: {
                    'api_key': '3f7C895Stwfxw5yAfFQcrnn5rJ_WBXcD',//请填写你创建的 apikey
                    'api_secret': 'R9Y-UKyUZOkXeWYEsXcgLVcsdPFlbiGV',//请填写你的api_secret
                    'face_tokens': that.data.face_token,//把上请求得到的人脸标识添加到脸集中
                    'outer_id': '15185672300',

                  },
                  header: {
                    'content-type': 'application/x-www-form-urlencoded',
                  },
                  success(res) {
                    console.log(res.data)

                    wx.showModal({
                      title: '提示',
                      content: '注册成功',
                      showCancel: false
                    })
                  },
                  fail: function (e) {
                    wx.showModal({
                      title: '提示',
                      content: '注册失败',
                      showCancel: false
                    })
                  },
                  complete: function () {

                    wx.hideToast();//隐藏提示
                  }
                })
              } else {
                wx.showModal({
                  title: '提示',
                  content: '你已经注册过了',
                  showCancel: false
                })
                return;
              }

            }
            console.log('face_token:' + that.data.face_token);

            if (res.statusCode != 200) {
              wx.showModal({
                title: '提示',
                content: '上传失败',
                showCancel: false
              })
              return;
            }
          },
          fail: function (e) {
            console.log(e);
            wx.showModal({
              title: '提示',
              content: '上传失败',
              showCancel: false
            })
          },
          complete: function () {
            wx.hideToast(); //隐藏Toast

          }
        })
      }
    })
  },
  error(e) {
    console.log(e.detail)

  }, //登录验证
  login: function () {
    var that = this
    const ctx = wx.createCameraContext(); //创建相机上下文
    ctx.takePhoto({
      quality: 'high',
      success: (res) => {
        this.setData({
          src: res.tempImagePath //相机拍照得到照片的地址
        })
        wx.showToast({
          icon: "loading",
          title: "正在上传中。。。"
        });
        wx.uploadFile({ //上传照片和脸集中的照片对比并得出结果

          url: 'https://api-cn.faceplusplus.com/facepp/v3/search', //对比人脸接口
          filePath: that.data.src,//上传相机拍照得到照片的地址
          name: 'image_file',
          header: {
            'content-type': 'application/x-www-form-urlencoded'
          },
          formData: {
            'api_key': '3f7C895Stwfxw5yAfFQcrnn5rJ_WBXcD',//请填写你创建的 apikey
            'api_secret': 'R9Y-UKyUZOkXeWYEsXcgLVcsdPFlbiGV',//请填写你的api_secret
            'outer_id': '15185672300', //脸集唯一标识
            'return_result_count': '1',//只反回一条匹配数据

          },
          success: function (res) {

            if (res.statusCode != 200) {
              wx.showModal({
                title: '提示',
                content: '上传失败',
                showCancel: false
              })
              return;
            }
            console.log(res)
            var obj = JSON.parse(res.data);//转成json对象
            if (obj['faces'][0] == null || obj['faces'][0] == '') {//判断是否检测到人脸
              wx.showModal({
                title: '提示',
                content: '未检测到人脸',
                showCancel: false
              })
              return;
            } else {
              that.setData({
                confidence: obj['results'][0]['confidence'] //可信值
              });

              console.log(obj['results'][0]['confidence']);

              if (that.data.confidence >= 80) { //可信值大于80就认为是同一个人

                wx.showModal({
                  title: '提示',
                  content: '验证通过',
                  showCancel: false
                })
                return;
              } else {
                wx.showModal({
                  title: '提示',
                  content: '验证失败',
                  showCancel: false
                })
                return;
              }
            }
          },
          fail: function (e) {
            console.log(e);
            wx.showModal({
              title: '提示',
              content: '上传失败',
              showCancel: false
            })
          },
          complete: function () {
            wx.hideToast(); //隐藏Toast
          }
        })
      }
    })
  },
  error(e) {
    console.log(e.detail)
  }

})

整个项目代码我已经上传到网盘。

链接:https://pan.baidu.com/s/156C64y-CO0PNw1jWmfgqcw
提取码:o3jb

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

微信小程序使用face++实现人脸识别登录注册 的相关文章

  • 【爬虫】一、BeautifulSoup库

    文档内容为本人观看北京理工大学嵩天老师公开课的听课笔记与实践总结 图片为从该课程下载资料的截图 感谢嵩老师 Key point 网页内容提取实际上是对标签的内容进行提取 其关键是标签的获取和标签感兴趣内容的提取 获取标签用beautiful
  • win10计算机设备感叹号,win10网络适配器出现感叹号的解决方法

    Win10系统仍然在不断完善 所以用户在使用过程中总会遇到一些陌生的问题 比如 有位用户在新装或重装的Win10系统中 就碰到了网卡不能安装 或安装出错 安装好网卡不能加载等等各种网卡驱动问题 今天小编就为大家简单的介绍一下Win10系统安
  • vtk光照、颜色、相机、坐标系统及空间变换

    1 vtkLight常的方法有 SetColor 设置光照的颜色 以RGB的形式指定颜色 SetPosition 设置光照位置 SetFocalPoint 设置光照焦点 SetIntensity 设置光照的强度 SetSwitch Swit
  • jsrender的基本使用

    1 什么是jsrender 一个JavaScript库 允许您定义一次样板结构并重复使用它来动态生成HTML JsRender为HTML5开发带来了一个新的模板库 它具有无代码标记语法和高性能 不依赖于jQuery 也不依赖于文档对象模型
  • Go-新手速成-流程语句

    1if Go的if不建议写 over if条件判断 age 16 if age lt 18 fmt Println 未成年 2for循环 Go摈弃了while和do while 循环 因为他做到了极简 也不要括号 这么写可以 total 0

随机推荐

  • Pandas知识点-reset_index,reindex,reindex_like,你分得清吗?

    Pandas知识点 reset index reindex reindex like 你分得清吗 reset index 用法详解 reset index 是pandas中将索引重置成自然数的方法 不会改变原始数据的内容和排列顺序 Data
  • 2023年第五届清洁能源与智能电网国际会议(CCESG 2023)

    2023年第五届清洁能源与智能电网国际会议 CCESG 2023 重要信息 会议网址 www ccesg org 会议时间 2023年11月3 5日 召开地点 广西 南宁 截稿时间 2023年10月3日 录用通知 投稿后2周内 收录检索 E
  • Python3基础入门

    文章目录 前言 基础说明 Python安装 Windows Ubuntu 开发环境 程序编写 模块和包 模块 module 包 package pip和换源 总结 前言 Python是目前非常流行的编程语言 这篇文章将对其相关入门内容进行说
  • JS判断数据类型的5种方法

    我们先来了解一下JS中数据类型有哪些 基本数据类型 值类型 String Number boolean null undefined symbol es6新增的 引用数据类型 引用类型 object 包含 Function Array Da
  • CSS line-height概念与举例

    本文同时发表在https github com zhangyachen zhangyachen github io issues 37 定义 两行文字基线之间的距离 基线的大体位置 基线的位置可以看成x字母下边缘的位置 不同字体的基线位置会
  • 微信公众号H5音频视频自动播放(安卓,苹果)

    我们都知道音频视频的自动播放被浏览器或者微信给限制了 必须用户跟页面交互才可以播放音视频 解决办法就是引入微信的jssdk 然后监听 WeixinJSBridgeReady 来实现自动播放 引入jssdk 音频或视频自动播放 documen
  • 查看运行的java程序的几种方式

    windows 任务管理器可以查看进程和线程数 也可以用来杀死进程 tasklist 查看进程 tasklist 杀死进程 linux ps ef 查看所有进程 ps ft p 查看某个进程 PID 的所有线程 kill 杀死进程 top
  • 【转载】手把手教你用 “三步法” 快速实现 4K+ 超高分辨率满细节出图

    手把手教你用 三步法 快速实现 4K 超高分辨率满细节出图 https ngabbs com read php tid 35888357 rand 488 准备工作 如果你的显存不足以直出你期望的最终分辨率 请先按照你习惯的方式安装 切片扩
  • uniapp - Map地图组件属性示例

    目录 1 markers 点标记 用于在地图上显示标记的位置 2 点聚合 3 polygons 4 include points 可以实现自动缩放展示视图内所有的点标记 5 polyline 线 map uni app官网 1 marker
  • littleVGL学习笔记5——lv_obj 基础对象

    1 介绍 littleVGL 是以对象为概念的 而其最核心的基础对象是 lv obj 控件 其他的所有专用控件 比如按钮 标签 列表等 都是在此 lv obj 对象的基础上衍生出来的 所有的控件对象都具有一些共同的属性 如下所示 位置 Po
  • JUC 十二. ReentrantReadWriteLock 与 StampedLock

    目录 一 基础 二 ReentrantReadWriteLock 的锁降级 三 StampedLock 邮戳票据锁 一 基础 ReentrantReadWriteLock 可以看为读读共享 读写 写写依然互斥 总结一句话 读写互斥 读读共享
  • 数字化时代-26:不要做数字空间的难民

    网络是人们新的生存空间 年轻人出生后就存在的空间 与人类社会原先的现实空间并存的人与人交流的空间 在这个空间中 没有自己位置的人 将成为未来社会的难民 年轻人 特别是毕业后的年轻人 需要思考 个人在数字空间中的落脚点和位置 数字原住民 在数
  • Ubuntu 20.04-NVIDIA显卡驱动-安装和卸载-解决黑屏问题

    这一步很重要 202300704更新 黑屏问题主要由linux内核更新导致 一定要保持当前的内核 也就是安装 NVIDIA 驱动时用的内核 sudo apt mark hold linux image generic linux heade
  • Cuda矩阵运算库cuBLAS介绍

    文章目录 简介 cuBLAS库新特性 cuBLAS代码热身 cublasSetMatrix cudaMalloc cublasSscal 源代码 cuBLAS 辅助函数 上下文管理 复制矩阵 数据类型标示 cuBLAS 运算函数 矩阵相乘
  • 有趣的 Async hooks 模块

    在 Node js 中 Async hooks 是一个非常有意思且强大的模块 虽然性能上存在一些问题 在 APM 中 我们可以借助这个模块做很多事情 本文介绍两个有趣的用法 AsyncLocalStorage 在 Node js 中 上下文
  • PaddlePaddle Hackathon 飞桨黑客马拉松热身赛上线!

    挑战自我 拓展技能 激发创新 挑战极限 再次相遇黑客松 我们期待你的加入 第五期 PaddlePaddle Hackathon 飞桨黑客马拉松热身赛上线 本次活动是面向全球开发者的深度学习领域编程活动 鼓励开发者了解和参与飞桨深度学习开源项
  • 如何制作一个简单的网页

    先创建一个文本文档 将后缀名改为 html 然后右击这个 选择打开方式 用记事本打开 开头与结尾要用来写 后一个要加 头部用head 中间部分用body 背景颜色用bgcolor 填一种颜色 字体颜色用text 填一种颜色 切记用英文 你如
  • ubuntu16.04 安装交叉编译工具aarch64-linux-gnu-gcc/g++

    前言 最近需要把人脸识别代码放到RK3399Pro的嵌入式板子上 所以编写好的c 代码要放到板子上编译 或者在ubuntu系统上使用交叉编译工具 编译好可执行文件在放到板子里运行 为了在能在ubuntu系统上能交叉编译 安装aarch64
  • 复杂场景下智能汽车目标检测心得体会

    提示 文章写完后 目录可以自动生成 如何生成可参考右边的帮助文档 文章目录 引言 一 复杂背景目标检测的复杂是什么 二 目标检测环境的复杂性包含哪些 三 复杂场景目标检测的目标复杂性包含哪些 四 复杂场景目标检测的算法复杂性包含什么 五 总
  • 微信小程序使用face++实现人脸识别登录注册

    Face 是一个 人工智能开放平台 要使用它我们得先注册并进入控制台创建API Key 这是前提 平台网址 https www faceplusplus com cn 整个项目代码我已经上传到网盘 链接 https pan baidu co