人脸识别face-api.js应用简介

前阵子学习了一下face-api.js ，偶有心得，跟大家分享一下。

face-api.js的原始项目是https://github.com/justadudewhohacks/face-api.js ，最后一个release是2020年3月22日的0.22.2版，组件较老，API文档很全，很适合开发参考。另有一位大佬的分支 https://github.com/vladmandic/face-api ,最近的release是2023年6月13日的1.7.12，组件较新，适合拿来使用。

face-api.js的人脸识别是基于对68个人脸特征点的检测来实现的，看得出来这个是基于二维图片识别来标识人脸的，可以在图片，视频中识别。跟咱们现在经常接触到的活体识别、3D结构光识别比可能要弱一些，不过胜在开源免费，也方便直接使用，在一些对人脸识别要求不高的场景，可以较好的应用。

vladmandic/face-api的release里包含demo，稍作修改就可以放在自己的项目里使用。比如webcam.js里，就有在浏览器中调用摄像头识别视频中人脸的方法。

具体怎么玩，可以这样弄下：

在后端定义一个人脸特征库 faces.json，格式如下：

{ uid:uid1, descriptors:\[ base64String1, base64String2, ...

{

uid:uid2,

descriptors:[

base64String3,

base64String4,

...

]

}

...

]

一个用户可以登记一次或多次人脸特征（可以在自己的项目里自行限制），为了便与保存文件和网络传输，特征采用base64编码的字符串。其实face-api.js采集出来的人脸特征是一个Float32Array，包含128个浮点数。

人脸注册，前端可以用下面这段：

javascript 复制代码

  faceapi
    .detectSingleFace(video, optionsSSDMobileNet)
    .withFaceLandmarks()
	.withFaceDescriptor()
	.then((result) => {
		if (result) {
			fetch2s_reg(result.descriptor,userid).then({...});//将用户与特征绑定信息传到后端
			return true;
			}
		else {
 	     const fps = 1000 / (performance.now() - t0);
    	 requestAnimationFrame(() => detectVideo(video, canvas));
      	 return true;
      	}
    })

人脸识别，前端可以用下面这段：

javascript 复制代码

  faceapi
    .detectSingleFace(video, optionsSSDMobileNet)
    .withFaceLandmarks()
	.withFaceDescriptor()
	.then((result) => {
		if (result) {
			fetch2s_rec(result.descriptor).then({...});//将特征信息传到后端，后端进行匹配后返回前端结果
			return true;
			}
		else {
 	     const fps = 1000 / (performance.now() - t0);
    	 requestAnimationFrame(() => detectVideo(video, canvas));
      	 return true;
      	}
    })

前文介绍过一种后端可以向一个可信任前端调用的方法，在这里可以用一下。

可信任前端可以用于人脸识别匹配检查。浏览器访问它，将执行连接后端websocket，获取当前人脸库，创建人脸匹配器；每次后端收到新的人脸绑定信息后，也会更新人脸库，并将人脸库更新也传到这个可行前端，它重新创建人脸匹配器（根据已有的文档资料，发现只能根据全量人脸库，创建人脸匹配器，无法增量更新）

javascript 复制代码

let labeledDescriptors = [
  new faceapi.LabeledFaceDescriptors(
    'obama',
    [descriptorObama1, descriptorObama2]
  ),
  new faceapi.LabeledFaceDescriptors(
    'trump',
    [descriptorTrump]
  )
]
faceMatcher = new faceapi.FaceMatcher(labeledDescriptors)

人脸识别，其实调用很简单：

javascript 复制代码

let bestMatch = faceMatcher.findBestMatch(descriptor)

拿人脸匹配器根据输入参数人脸特征，返回最佳匹配结果和差异度。

匹配是找出与目标特征值欧几里得距离最小的特征值，以及这个最小值的大小。

其他注意要点：JS前端到nodejs后端，人脸特征float32array可以fetch方式传arraybuffer数据，uid可以放到header里传出；后端nodejs收到arraybuffer的float32array数组，直接转base64编码，更新内存中的人脸库json数组中，并通过websocket发送到可信前端以更新人脸匹配器，关于保存到json文件，不用每次更新都写入，可以定义一个接口，按请求来写入。可信前端需要处理获取人脸库，将base64编码的字符串还原位float32array的人脸特征，然后创建人脸匹配器；以及执行人脸匹配检查。