网络浏览器的功能日渐强大。网站和网络应用的复杂性也在增加。几十年前需要超级计算机的操作现在在智能手机上运行。其中之一就是人脸检测。
检测和分析人脸的能力是超级有用的，因为它使我们能够添加巧妙的功能。想想看，自动模糊人脸（像谷歌地图那样），平移和缩放网络摄像头画面以聚焦于人（像微软团队那样），验证护照，添加愚蠢的过滤器（像Instagram和Snapchat那样），等等。但在做这一切之前，我们首先需要找到人脸!
Face-api.js是一个库，使开发人员能够在他们的应用程序中使用人脸检测，而不需要有机器学习的背景。
本教程的代码可以在GitHub上找到。
用机器学习进行人脸检测
检测物体，如人脸，是相当复杂的。想一想：也许我们可以写一个程序，扫描像素来找到眼睛、鼻子和嘴巴。这是可以做到的，但要使它完全可靠，实际上是无法实现的，因为有许多因素需要考虑。想想光照条件、面部毛发、大量的形状和颜色、化妆、角度、脸部面具等等。
然而，神经网络擅长处理这类问题，并且可以概括地考虑到大多数（如果不是全部）条件。我们可以在浏览器中使用TensorFlow.js创建、训练和使用神经网络，这是一个流行的JavaScript机器学习库。然而，即使我们使用一个现成的、预先训练好的模型，我们仍然会有点陷入向TensorFlow提供信息和解释输出的琐事。如果你对机器学习的技术细节感兴趣，可以查看 "A Primer on Machine Learning with Python"。
进入face-api.js。它把所有这些都包装成一个直观的API。我们可以传递一个img 、canvas 、或video DOM元素，该库将返回一个或一组结果。Face-api.js可以检测人脸，但也可以估计其中的各种东西，如下所示。
- 面部检测：获得一个或多个面孔的边界。这对于确定人脸在图片中的位置和大小很有用。
- 脸部地标检测：获得眉毛、眼睛、鼻子、嘴巴和嘴唇以及下巴的位置和形状。这可用于确定面向方向或在特定区域投射图形，如鼻子和嘴唇之间的胡子。
- 人脸识别：确定谁在照片中。
- 面部表情检测：从面部获得表情。请注意，不同的文化背景下，里程数可能不同。
- 年龄和性别检测：从一张脸获得年龄和性别。请注意，对于 "性别 "分类，它将一张脸归类为女性或男性，这并不一定能揭示他们的性别。
在你在实验之外使用任何这些东西之前，请注意，人工智能擅长放大偏见。性别分类对双性恋者很有效，但它不能检测我的非双性恋朋友的性别。它在大多数时候都能识别白人，但经常无法检测到有色人种。
在使用这项技术时要考虑周全，并在不同的测试小组中进行彻底测试。
安装
我们可以通过npm安装face-api.js。
npm install face-api.js
然而，为了跳过建立工具的设置，我将通过unpkg.org包含UMD捆绑包。
/* globals faceapi */
import 'https://unpkg.com/face-api.js@0.22.2/dist/face-api.min.js';
之后，我们需要从库中下载正确的预训练模型。确定我们想从脸部知道什么，并使用可用模型部分来确定需要哪些模型。有些功能可以使用多个模型。在这种情况下，我们必须在带宽/性能和准确性之间做出选择。比较各种可用模型的文件大小，选择你认为最适合你的项目的模型。
不确定你的使用需要哪些模型？你可以稍后再回到这个步骤。当我们在没有加载所需模型的情况下使用API时，将抛出一个错误，说明该库所期望的模型。
现在我们已经准备好使用face-api.js的API了。
例子
让我们建立一些东西!
在下面的例子中，我将用这个函数从Unsplash Source加载一张随机图片。
function loadRandomImage() {
const image = new Image();
image.crossOrigin = true;
return new Promise((resolve, reject) => {
image.addEventListener('error', (error) => reject(error));
image.addEventListener('load', () => resolve(image));
image.src = 'https://source.unsplash.com/512x512/?face,friends';
});
}
继续阅读SitePoint上的Face-api.js网络人脸检测。
