前言
? ? ? ? 這里要介紹的是 Tensorflow.js 官方提供的兩個人臉檢測模型斤葱，分別是 face-detection 和 face-landmarks-detection。他們不但可以對視頻中的人間進行精確定位甚负，而且還能對當前設備 (手機 / 電腦攝像頭) 采集的直播流實時監(jiān)測人臉霎挟。所以這些的應用場景就很常見了窝剖，比如在線美顏，實時添加互動虛擬掛件等等酥夭。
? ? ? ? 雖然這兩個模型實現(xiàn)的功能類似赐纱，但是也還是有區(qū)別滴。face-landmarks-detection 相比 face-detection 對人臉的檢測有更多的特征點熬北，而特征點更多可用來做類似建模匹配的重合度就越高疙描，以下會通過官方的例子打印出臉部的特征點數(shù)據(jù)。
實操
1. 下載源碼讶隐。
2. 單獨提出 demos 里 upload_video起胰。
? ? ? ? 這里要說明一下，因為個人習慣巫延，我這里還是通過 parcel 方式打包效五。官方推薦是 yarn，而且有文檔流程介紹炉峰，可以按著上面運行畏妖。而我的方法完全不按套路出牌，其實單獨提出 demo 里項目運行也是不正確疼阔，npm 安裝報錯連連瓜客，那我就對我遇到的幾個錯誤做一一復原吧。
2.1. npm install 拋出各種依賴包版本沖突竿开，npm ERR! code ERESOLVE npm ERR谱仪，如下。
2.1.1. 原因：
? ? ? ?由于本人前端水平有限否彩，經(jīng)過查閱疯攒，是 npm 版本原因。npm 從 v7 開始列荔，默認安裝 peerDependencies敬尺。在多數(shù)情況下，導致版本沖突贴浙，從而終端安裝過程砂吞，在安裝前可以查詢一下 npm -v，小于 v7 就不用看下面方法了崎溃。
2.1.2. 解決方法：
在命令后面添加 --legacy-peer-deps
? ? ? ? ?加了這個就可以繞過 peerDependency 自動安裝蜻直，告訴 NPM 忽略項目中引入的各個模塊之間的相同模塊，但不同版本的問題，保證各個引入的依賴之間對自身所使用的不同版本模塊共存概而，最后的依賴就安裝成功了呼巷，最后就執(zhí)行 parcel index 打包。
2.2. parcel 時赎瑰，拋出 face-detection 模型不存在王悍，如下。
2.2.1. 原因：
? ? ? ? 這里就是我運行項目時的方法不對餐曼，因為運行時需要在外面進行安裝打包會生成模型文件压储，而 demos 里的模型引入其實是引入前面打包好的文件，我們可以看到 package.json 里源譬。
2.2.2. 解決方法：
? ? ? ? 將 package.json 里的模型依賴刪掉渠脉，也就是上面標注的部分，然后通過 npm 進行安裝瓶佳，安裝成后 json 文件會更新芋膘，其他問題類似。
npm install@tensorflow-models/face-detection --legacy-peer-deps
運行效果
1.?face-detection
參數(shù)：?model=mediapipe_face_detector
通過打印可以看到以上數(shù)據(jù)霸饲，box 是目標的寬高等值为朋，而 keypoints 就是檢測出人臉的 6 個特征點。包括特征的名稱和移動位置等信息厚脉。
2.?face-landmarks-detection
參數(shù)：?model=mediapipe_face_mesh
? ? 打印出的不同的 face-detection 的是习寸，keypoints 數(shù)據(jù)更多，除了檢測出人臉五官傻工，而且五官輪廓的點位置也全部識別出來了霞溪。
