基于TrackingJS庫+百度云人臉識別課程簽到系統(tǒng)設計與實現(xiàn)

關鍵詞：簽到系統(tǒng);課程簽到;人臉識別;TrackingJS;百度云人臉識別API

0 引言（Introduction）

人工智能技術發(fā)展為教育領域帶來新的發(fā)展機遇，其中課

程智能簽到系統(tǒng)[1]作為智慧教育的一個研究方向，旨在高效、低成本地解決學生課堂簽到問題，并確保簽到的可靠性和防作弊性。課程簽到與公司的上、下班簽到不同，公司簽到通常都有固定時間，通過指紋識別[2]打卡機或人臉識別[3]打卡機就能實現(xiàn)打卡功能。然而，學校課程簽到方式更為復雜，涉及不同的時間段、教室地點、教師和班級等。由于影響簽到因素眾多，若在每間教室都安裝簽到機，將導致高昂成本和復雜系統(tǒng)設計。簽到分為線上和線下兩種方式。線上簽到適用于慕課、云課堂、視頻會議等網(wǎng)絡課程，無特定地點要求;線下簽到則需在實體場所如教室、會場進行，以確認參與者親自到場。本文聚焦于線下簽到功能，利用前端的TrackingJS人臉識別跟蹤技術高效抓取完整的人臉圖像，結合百度云人臉識別接口完成人臉識別認證，同時設計了一個基于教師端的手機攝像頭拍照功能，以綜合解決方案應對學生課程簽到的各種挑戰(zhàn)。

1 線下簽到技術分析（Study of off-line attendancetechnologies）

1.1 基于考勤機器的簽到

在智能手機普及之前，企事業(yè)單位通常采用考勤機進行員工簽到，由于上班時間統(tǒng)一，所以一兩臺考勤機就能滿足中小企事業(yè)單位的簽到要求。

（1）射頻識別技術（RFID）和近場通信（NFC）刷卡機簽到

刷卡機簽到方式在企事業(yè)單位得到廣泛應用，員工使用卡片刷卡完成考勤，但是這種方式存在作弊風險，員工可能代刷。RFID簽到則要求員工人手一張卡和一個專用讀卡器。有學者提出通過手機NFC技術實現(xiàn)課堂智能簽到[4]，或是在客戶端通過RFID模塊采集學生的校園一卡通卡號，再通過無線網(wǎng)絡將考勤信息傳輸?shù)椒掌鞫薣5]。

（2）指紋機和人臉識別機簽到

利用人工智能的圖像識別技術，通過指紋機和人臉識別機進行人員考勤，主要用于企事業(yè)單位。這種方式避免了作弊行為，但是如果在每個教室安裝一個簽到機，成本比較高，無法大范圍推廣，例如項新建等[2]設計了一款課堂指紋簽到智能管理系統(tǒng)。

（3）聲紋識別機和虹膜識別機簽到

聲紋識別機和虹膜識別機成本比較高，因此通常只用在特殊行業(yè)，如銀行等對安全級別要求很高的單位使用。

1.2 基于智能手機App簽到

隨著智能手機技術的快速發(fā)展，攝像頭、Wi-Fi、GPS技術已經成為手機的基本配置，通過這些硬件可以實現(xiàn)手機App簽到。

（1）基于Wi-Fi和地理位置簽到

植入地理位置識別功能的簽到App要求簽到者在指定地點簽到，可以防止簽到作弊行為。但是，在高樓或建筑群中，GPS信號可能受影響，降低了簽到可靠性。Wi-Fi簽到則要求用戶連接特定的Wi-Fi，使用不便。例如，ZHANG等[6]通過位置服務+ 人臉識別技術解決簽到作弊問題，耿申[7]基于WLAN室內定位+二維碼技術開發(fā)了一款簽到系統(tǒng)。

（2）二維碼簽到

例如，釘釘App允許用戶創(chuàng)建線下會議，填寫相關信息后會生成簽到二維碼，參會者需在會場通過釘釘App掃描此二維碼進行簽到。然而，簽到作弊行為依然可能發(fā)生，參會者可能會拍照并將二維碼分享給他人進行遠程簽到，而非在會場現(xiàn)場簽到。周歡等[8]提出基于主動式二維碼+LBS技術的學生考勤管理系統(tǒng)應用研究，杜絕“代簽到”現(xiàn)象。包蕾[9]設計并實現(xiàn)了一款基于二維碼的代簽規(guī)避系統(tǒng)。

（3）人臉識別簽到

隨著人工智能技術的快速發(fā)展，人臉識別已經成為簽到設計的主要技術，由于智能手機基本都配備了攝像頭及基于云技術的人臉識別技術，所以降低了開發(fā)簽到App的復雜性，降低了使用成本，使其成為簽到系統(tǒng)的基本功能。例如，DUAN設計了一款人臉識別課程簽到系統(tǒng)[10]。

2 系統(tǒng)設計（System design）

人臉識別技術已普遍應用于簽到功能，百度云、阿里云、騰訊云等云服務商均提供了人臉識別接口，使系統(tǒng)開發(fā)者能更專注于簽到流程的優(yōu)化，解決系統(tǒng)成本高、可靠性不足、無法完全避免作弊行為等問題。設計思路主要從以下幾個方面考慮。

2.1 前端人臉跟蹤

TrackingJS[11]是基于瀏覽器端的人臉檢測庫，用于實時追蹤來自相機捕獲的圖像。追蹤的數(shù)據(jù)對象可以是顏色或人的圖像。若追蹤的數(shù)據(jù)對象為人臉圖像時，還可以設置具體的追蹤檢測目標為人臉圖像中的眼睛、鼻子、嘴巴，當檢測到目標移動或者出現(xiàn)時，就會觸發(fā)JavaScript事件，最終根據(jù)JavaScript的回調函數(shù)完成完整的動態(tài)人臉圖像抓取。

2.2 基于百度云人臉識別接口

通過百度云人臉識別API（接口）[12]，將前端捕獲的人臉圖像與已注冊的人臉庫中的圖片進行相似度比對，并返回相似度分值。本系統(tǒng)設置相似度分值大于80為識別匹配。

2.3 基于教師端課程簽到

學生端簽到方式適用于線上網(wǎng)課，教師可以發(fā)送簽到碼或二維碼，學生則在學生端通過人臉識別完成簽到;線下課程簽到方式如果設計為學生端人臉識別簽到，還要考慮添加GPS或Wi-Fi定位功能，防止學生作弊。陳維華等[13]設計了一款基于網(wǎng)絡攝像頭設備的簽到系統(tǒng)，需要在每個教室都布置網(wǎng)絡攝像頭，并且系統(tǒng)需要處理每個教室攝像頭發(fā)出的請求，成本較高，系統(tǒng)設計復雜度高。賀一粒[14]設計了一款基于深度學習框架Keras和Tensor Flow的教師端人臉識別系統(tǒng)，需要對人臉識別模型進行訓練，增大了系統(tǒng)開發(fā)工作量。本系統(tǒng)采用教師手機端人臉識別簽到方式，簽到流程為教師手機發(fā)起簽到，開啟攝像頭并放講臺上，學生主動掃臉簽到。此方案能有效防止代簽，簡單易行、成本低且可靠，學生無手機或手機沒電時也能完成課程簽到。

2.4 課程簽到設計

課程簽到方式主要分為線下課簽到、線上課簽到、公開課簽到3種方式。發(fā)起課程簽到狀態(tài)圖如圖1所示。

2.5 功能模塊設計

本系統(tǒng)的用戶角色分為管理員、教師、學生3種。

（1）管理員。管理員用戶的系統(tǒng)權限主要包括用戶登錄、系統(tǒng)管理、用戶管理、課程管理和系統(tǒng)監(jiān)控，其中系統(tǒng)管理又包含7個子模塊，主要為菜單管理、角色管理、部門管理、職務管理、通知公告、字段管理、日志管理;系統(tǒng)監(jiān)控包含在線用戶子模塊。管理員用例圖如圖2所示。

（2）教師。教師用戶的系統(tǒng)權限主要包括用戶注冊登錄和課程管理。教師用例圖如圖3所示。

（3）學生。學生用戶的系統(tǒng)權限主要包括用戶登錄、查看首頁通知、課程學習和簽到記錄。學生用例圖如圖4所示。

3 架構設計（Architecture design）

依據(jù)智慧教育生態(tài)系統(tǒng)分層架構的設計思想[15]，進一步改進和優(yōu)化本系統(tǒng)架構方案。本系統(tǒng)的后端開發(fā)采用Java語言，基于Spring Boot框架，部署于TOMCAT服務器，前端采用VueJS框架，部署在Nginx服務器，并做負載均衡器。數(shù)據(jù)接口采用Redis數(shù)據(jù)庫作為緩存，持久化層采用MySQL數(shù)據(jù)庫。采用MyBatis框架實現(xiàn)Java對象與數(shù)據(jù)庫表的ORM 關系映射，完成數(shù)據(jù)持久化。

該架構要求前端項目和后端項目分別部署于兩個不同的服務器上，并且需要獨立進行部署。由于前端和后端是兩個不同的工程，因此它們有著不同的代碼庫。同時，前端通過Ajax技術調用后端的Restful API，后端再通過跨域訪問百度云人臉識別接口，從而實現(xiàn)真正的解耦。前后端分離MVC架構模式（圖5）。這種架構設計主要解決了全校上萬學生同一簽到時間的阻塞問題。

4 核心功能實現(xiàn)（Implementation of core functions）

4.1 人臉識別模塊

人臉識別模塊主要是為了支持課程簽到服務而開發(fā)的模塊，包含人臉信息注冊和人臉識別認證兩個子功能，確保學生進行課程簽到打卡時能通過人臉識別進行身份認證。人臉信息注冊功能主要為了將用戶人臉畫像進行保存，在用戶使用人臉識別認證功能時，可以將用戶注冊的人臉畫像進行比對，從而判斷是否為用戶本人進行操作;人臉識別認證功能主要為了在簽到打卡時確保是學生本人的操作，從而預防作弊行為。

4.2 人臉信息注冊

人臉信息注冊主要基于人臉檢測技術TrackingJS完成人臉的檢測追蹤操作，TrackingJS檢測到人臉后，前端服務自動捕獲人臉畫像，并將人臉畫像轉換為BASE64編碼格式，最終使用Axios異步請求后端人臉信息注冊接口，由后端完成人臉信息本地數(shù)據(jù)庫保存操作和百度人臉可視化庫人臉注冊操作，并將人臉信息注冊結果返回前端進行渲染后展示給用戶。

4.3 人臉識別認證

人臉識別認證功能主要輔助簽到功能，主要判別學生簽到時是否為學生本人;人臉識別認證功能分為兩種使用場景：一種是單次人臉識別認證，在調用人臉識別組件時將autoClose屬性設置為true，主要在云課程簽到中使用，學生用戶在簽到時進行單次人臉識別，識別完成后系統(tǒng)自動關閉人臉識別彈窗;另一種是連續(xù)人臉識別認證，在調用人臉識別組件時將autoClose屬性設置為1，主要在線下課簽到中使用，教師創(chuàng)建完課程簽到后學生可依次進行人臉識別認證簽到，教師可手動關閉人臉識別彈窗，同時系統(tǒng)也支持簽到時間結束后自動關閉人臉識別彈窗。人臉識別認證活動圖如圖6所示。

（1）代碼分析

前端通過TrackingJS抓取人臉代碼如下，tracker.on（）函數(shù)監(jiān)聽攝像頭抓取到包含眼睛和嘴巴的完整人臉圖像，觸發(fā)回調函數(shù)處理人臉圖像。

人臉識別百度云接口調用代碼如下，aipFace.search（）發(fā)起百度云接口調用，返回的數(shù)據(jù)包存放到responseBody JSON對象中，若錯誤碼為“0”且返回的圖片相似度分值≥80，則返回識別成功的用戶ID。

4.4 線下課簽到模塊

在線下課簽到場景下，授課教師發(fā)起線下課簽到后，教師端攝像頭自動開啟，在教室內上課的學生逐一進行刷臉簽到。該簽到方式的應用場景類似于學校門禁刷臉系統(tǒng)。線下課簽到活動圖如圖8所示。

線下課（課堂）簽到具體實現(xiàn)步驟如下。

（1）教師點擊“線下課”發(fā)起簽到（圖9）。

（2）教師填寫簽到信息，包括主題、簽到活動時長、教室。然后選擇“教師端簽到”，點擊“開始簽到”（圖10）。

（3）教師打開簽到攝像頭和簽到進度窗口，如果學生簽到成功，就會在簽到進度窗顯示學生頭像圖標和姓名（圖11）。

5 未來改進方法（Improving the approach inthe future）

未來的主要開發(fā)工作將圍繞提升用戶體驗和性能兩個方面進行。

（1）采用PWA（漸進式Web應用）技術

由于必須在手機上打開瀏覽器輸入URL地址才能啟動Web應用，導致用戶體驗感不好，因此采用PWA技術讓系統(tǒng)更接近原生應用，實現(xiàn)在桌面直接啟動應用系統(tǒng)，或者開發(fā)前端微信小程序，提高用戶的體驗感。

（2）人臉識別驗證性能優(yōu)化

采用消息隊列的方式進行人臉識別簽到，將現(xiàn)階段的同步請求百度的人臉識別API接口改為異步的方式，提高系統(tǒng)的響應速度。

（3）配置Nginx服務器負載均衡機制

根據(jù)日志監(jiān)測流量，充分利用Nginx服務器負載均衡機制，反向代理機制將動態(tài)請求轉發(fā)給后臺Tomcat應用服務器進行優(yōu)化處理，或者將Web服務器遷移到百度云，由云計算動態(tài)調整負載均衡機制。

（4）優(yōu)化Redis數(shù)據(jù)緩存

進一步優(yōu)化和調整Redis緩存數(shù)據(jù)結構，提高簽到查詢效率，避免對數(shù)據(jù)庫造成過大的壓力，通過日志監(jiān)測機制，將數(shù)據(jù)訪問量減少至一個閾值，及時同步持久化數(shù)據(jù)。

（5）課堂紀律監(jiān)控

基于多人臉識別抓取和肢體識別技術，教師可以通過手機攝像頭實時監(jiān)控課堂，統(tǒng)計學生抬頭聽課與低頭睡覺或玩手機等課堂行為，以維護課堂紀律。

6 結論（Conclusion）

通過人臉識別技術，設計并實現(xiàn)了一種教師端課堂人臉識別簽到系統(tǒng)。完成了基于人臉識別技術的簽到系統(tǒng)的界面和數(shù)據(jù)庫設計，系統(tǒng)通過教師端手機，開啟簽到攝像頭，通過TrackingJS人臉追蹤技術動態(tài)抓取完整的人臉圖片，通過百度云人臉識別接口完成人臉驗證，并記錄和統(tǒng)計學生的簽到信息，導出簽到記錄。通過測試，系統(tǒng)具備較高的識別精度和可靠性，滿足了對學生簽到管理的實際需求。系統(tǒng)設計中，把課程簽到分為線下課簽到和線上課簽到及公開課簽到3種方式，保證了線下課簽到的可靠性，還能防止學生出現(xiàn)異地簽到和虛假簽到等情況，系統(tǒng)設計思路簡潔明了，具有較高的實用性、安全性和可維護性。