杜興

（貴州電子信息職業(yè)技術(shù)學院，貴州凱里，556000）

0 引言

在日常中，用戶經(jīng)常在網(wǎng)頁中使用用戶名和密碼才能被后臺允許進行后續(xù)操作。相比這種登錄方式，會存在忘記密碼、使用場景不夠遍歷便以及不夠智能等情況。因此，本系統(tǒng)設計了兼容傳統(tǒng)登錄方式的新型掃臉登錄注冊系統(tǒng)。

1 系統(tǒng)整體設計

整個系統(tǒng)設計采用Web開發(fā)中常用的MVC設計模式。系統(tǒng)前端使用基于HTML、CSS以及采用JavaScript語言開發(fā)的自適應框架Bootstrap用來快速構(gòu)建布局網(wǎng)頁中的表單、按鈕以及鏈接等常用元素，系統(tǒng)設計的每個需求模塊對應一個前端的HTML文件，方便系統(tǒng)的設計管理和復用。

系統(tǒng)后端采用Flask的Web框架來構(gòu)建整個后端部分。后端使用Python作為程序設計語言，數(shù)據(jù)庫框架PyMySQL、Dlib人臉識別框架、OpenCV計算機視覺庫及模板渲染庫jinja2等。現(xiàn)階段多端開發(fā)主流設計模式是前后端分離的同步設計模式，而本系統(tǒng)注重掃臉登錄注冊功能的實現(xiàn)，根據(jù)系統(tǒng)設計的復雜程度，本系統(tǒng)采用前后端不分離的整體設計思想，方便快速實現(xiàn)整個掃臉系統(tǒng)。

本系統(tǒng)采用了兩種并行的設計思路、即傳統(tǒng)用戶名密碼登錄和掃臉登錄。系統(tǒng)的整體實現(xiàn)構(gòu)架如圖1所示。

圖1 系統(tǒng)整體構(gòu)架圖

根據(jù)系統(tǒng)設計圖的需求，系統(tǒng)主界面包含傳統(tǒng)方式登錄、掃臉方式登錄以及用戶注冊三部分組成。在傳統(tǒng)登錄模塊中，設計思路是后臺獲取用戶在前端提交的用戶名和密碼后與后端數(shù)據(jù)庫進行比對（數(shù)據(jù)校驗），校驗通過則登錄成功。在用戶注冊模塊中，首先考慮存在是否侵犯隱私等問題以及系統(tǒng)所提及的并行設計模式，用戶可以只提交用戶名和密碼，而人臉數(shù)據(jù)根據(jù)用戶自行選擇。如果在注冊時提交了人臉信息，傳統(tǒng)和掃臉兩種登錄方式都可以使用，反之則只能使用傳統(tǒng)方式進行登錄。在掃臉登錄模塊中，用戶需要輸入用戶名和人臉信息（類似于傳統(tǒng)登錄方式的密碼）與后端數(shù)據(jù)庫進行比對（人臉校驗），校驗通過則登錄成功。

該系統(tǒng)的主要創(chuàng)新點是可以不使用密碼的情況下使用人臉進行登錄和注冊。在用戶注冊和登錄模塊中，會涉及到網(wǎng)頁驅(qū)動本地的攝像頭、以及針對圖片的采集和數(shù)據(jù)的傳輸，在網(wǎng)頁中驅(qū)動攝像頭采用JavaScript語言。另外，前端采用Ajax技術(shù)向后端提交人臉圖片數(shù)據(jù)，由于人臉數(shù)據(jù)是被保存的是圖片格式，不便利于網(wǎng)絡傳輸，是需要經(jīng)過將圖片進行base64編碼的操作。而后端將base64編碼的數(shù)據(jù)解碼成圖片格式數(shù)據(jù)（＊.jpg），為后續(xù)數(shù)據(jù)處理做準備。在掃臉登錄方式中，用戶提交人臉信息與后端數(shù)據(jù)信息（人臉68個特征點）進行歐式距離比對，歐式距離小于設定閾值則登錄成功。

2 用戶注冊

在用戶注冊時，用戶通過如圖2所示的前端界面向后臺提交信息，頁面中的用戶名和密碼通過form表單以字符串類型提交到后端并存儲到數(shù)據(jù)庫MySql中。其中在注冊人臉信息是可選項，如果用戶在注冊時選擇提交了人臉圖像信息，此時后端數(shù)據(jù)庫存儲的并不是人臉圖片數(shù)據(jù)，而是存儲的是人臉的68個特征點。具體流程是獲取前端頁面提交的人臉信息并編碼成base64的數(shù)據(jù)格式，后端將此數(shù)據(jù)解碼成圖片格式，接著經(jīng)過Dlib開源框架先檢測出人臉所屬的圖像位置，之后根據(jù)檢測出的只含有人臉圖片區(qū)域計算出人臉圖像的68個特征點，存儲到數(shù)據(jù)庫中。以用戶名為lena、密碼為123456，該部分功能訪問的鏈接為http://127.0.0.1:5000/register.html，其中http://127.0.0.1為本機服務器IP地址，5000為端口號，register.html為訪問的頁面，系統(tǒng)界面如圖2所示。

圖2 用戶注冊界面圖

一般情況下，為了防止用戶在密碼設置過于簡單的情況發(fā)生，本系統(tǒng)會在前端對用戶輸入的密碼進行校驗，提前在前端對數(shù)據(jù)的合理性進行校驗，防止不合理的數(shù)據(jù)直接傳輸?shù)胶蠖?。在校驗密碼合理性中，本系統(tǒng)采用了基于JavaScript語言的正則匹配方法，設計目標是使用戶和密碼必須涵蓋六位字符以上且必須必須涵蓋數(shù)字、字母（大小寫）、及特殊字符的兩種或兩種及以上的類別。

為了模型系統(tǒng)的真實性，現(xiàn)在已經(jīng)在用戶注冊界面中提交不同數(shù)量用戶信息。在Navicat數(shù)據(jù)庫可視化軟件中將數(shù)據(jù)進行可視化，用戶數(shù)據(jù)如圖3所示，其中存儲用戶的數(shù)據(jù)庫名為user_general，用戶名、密碼以及人臉信息分別由字段user_name，user_password，face_data表示，字段的數(shù)據(jù)類型分別為varchar、varchar、longblob。

圖3 數(shù)據(jù)庫用戶信息

3 傳統(tǒng)方式登錄

該系統(tǒng)可以采用傳統(tǒng)方式登錄系統(tǒng)，主要設計思想是獲取用戶在前端頁面用戶名和密碼信息提交到后端，后端通過Flask的Web框架與數(shù)據(jù)庫中進行校驗。在程序上體現(xiàn)即判斷前端提交信息與后端數(shù)據(jù)庫信息是否相同，如果比對相同則成功登錄該系統(tǒng)。由于本設計注重整個系統(tǒng)的完整性和可行性，在提交用戶名和密碼等信息舍棄掉加密等安全性功能。該部分功能訪問的鏈接為http://127.0.0.1:5000/login，登錄界面如圖4所示。

圖4 系統(tǒng)的主界面

以用戶名和密碼分別為admin和123456a為例，在系統(tǒng)主界面輸入對應的用戶信息則會跳轉(zhuǎn)到登錄成功的界面，該部分功能訪問的鏈接為http://127.0.0.1:5000/login#，界面如圖5所示。

圖5 用戶登錄成功界面

4 掃臉方式登錄

人臉檢測和識別的優(yōu)劣決定本系統(tǒng)設計亮點的可行性。在人臉檢測和識別上使用一款基于C++語言開發(fā)的機器學習的跨平臺工具庫Dlib，該框架在人臉特征的提取和識別方面有不錯的性能表現(xiàn)。

Dlib框架用作人臉檢測和識別流程比較簡單。首先，獲取前端驅(qū)動Web頁面的攝像頭并采集含有人臉的圖像信息提交到后端，然后后端依托Web框架和基于Python語言調(diào)用Dlib框架對圖像含有人臉特征信息進行檢測和提取，得到對應的68個特征點（即表示一張人臉），以lena人臉圖像為例，特征點如圖6所示，這一過程與掃臉注冊時的流程類似。然后將該人臉特征點的信息存儲在MySQL數(shù)據(jù)庫中。最后，將前端提交人臉信息與后端注冊時存儲的人臉信息差異作比較（差異小于設定閾值），小于閾值則登錄成功。

圖6 lena圖像人臉的特征點

在比對前端與后端兩部分人臉信息閾值時，本系統(tǒng)采用歐式距離的方式來衡量前端提交人臉信息和后端存儲人臉信息的相似度情況。具體做法如下，前端采集含有一張含有人臉的圖像，與數(shù)據(jù)庫的人臉信息進行差值比較，如果兩者差值小于其設定閾值，則被判斷是同一張人臉，否則判定不是。其中，差值的計算方式采用歐式距離的計算方法。如公式1所示，公式中的68表示人臉信息由68個特征點組成，x和y表示前后兩端對應的維度人臉的特征信息。

考慮到日常生活中，用戶在登錄和注時往往是單獨一個人進行操作，基本不存在同時需要多個用戶同時掃多張人臉進行登錄網(wǎng)頁。因此，考慮到此種特殊情況，前端網(wǎng)頁采集的人臉信息超過兩人及其以上時，后端采用基于Dlib框架對含有人臉圖像的數(shù)量進行統(tǒng)計，如果統(tǒng)計數(shù)量大于二，系統(tǒng)會有相應的信息提示，阻止后續(xù)操作流程，以保證登錄系統(tǒng)的健壯性。其中，Dlib人臉框架不僅可以完成人臉檢測和識別的任務，還可以實現(xiàn)統(tǒng)計圖像中人臉數(shù)量的功能。

在設置兩個人臉是否屬于同一個人的閾值（歐式距離的值）時，本系統(tǒng)依據(jù)計算大量人臉數(shù)據(jù)的方法獲取人臉相似度閾值。具體做法如下，首先，在LFW（5749個人臉類別）人臉數(shù)據(jù)集中選取在一個類別中含有兩張及兩張以上人臉信息作為計算歐式距離的人臉圖片樣本，接著使用基于Python語言的Dlib人臉檢測識別框架遍歷計算出不同和相同類別的人臉特征信息歐式距離值，并統(tǒng)計其中的最小值、最大值、均值、眾數(shù)以及中位數(shù)等有效的數(shù)據(jù)信息，依照數(shù)據(jù)的分布情況，最后根據(jù)人臉信息比對的敏感程度合理設定閾值大小。

LFW是一個比較經(jīng)典的人臉數(shù)據(jù)集，數(shù)據(jù)集含有5749個類別的人臉，圖片總數(shù)量為13233，大約有1680個類別含有兩張及兩張以上的人臉圖片（這部分圖像用于計算圖像的相似度閾值），圖片尺寸為250×250，數(shù)據(jù)集大部分為為彩色圖像以及含有少量灰度圖像。在計算人臉閾值時發(fā)現(xiàn)，由于該人臉數(shù)據(jù)集是在自然場景下采集，若一張圖片中含有多個人臉圖像時或者出現(xiàn)人臉模糊及遮擋等情況，考慮到掃臉登錄系統(tǒng)采集的人臉環(huán)境比較理想，手動的將其剔除防止數(shù)據(jù)干擾。

在掃臉登錄模塊中，人臉特征信息可被視作為用戶密碼，以該實驗系統(tǒng)為例，兩張人臉圖像的尺寸大小為480×480，識別時間大概為0.002s。（以本系統(tǒng)所運行的硬件配置為例）若點擊圖4中掃臉登錄按鈕，跳轉(zhuǎn)到掃臉登錄的界面，掃臉登錄頁面如圖7所示，用戶只需輸入用戶名和錄入人臉即可登錄。如果提交的用戶人臉信息與數(shù)據(jù)庫中人臉信息的歐式距離小于設定值即可成功登錄。該部分功能訪問的鏈接為http://127.0.0.1:5000/face.html，登錄成功的提示界面信息如圖7所示。

圖7 掃臉登錄頁面

在設計掃臉登錄系統(tǒng)的早期調(diào)試過程中發(fā)現(xiàn)只使用人臉特征作為登錄信息可以實現(xiàn)功能需求。但是，這種方法會隨著數(shù)據(jù)庫中的人臉信息的數(shù)據(jù)增加而變得隨機，這種方法會造成登錄時間不固定的情況，造成該系統(tǒng)的體驗不佳?？偨Y(jié)發(fā)現(xiàn)，在硬件配置相同的情況下，產(chǎn)生這種現(xiàn)象的原因是由很多用戶注冊時提交在后臺數(shù)據(jù)庫人臉特征信息的數(shù)據(jù)量變的越來越大，以及在掃臉登錄時所提交的人臉信息與后臺數(shù)據(jù)庫存儲人臉信息計算差值的先后順序共同決定。為了解決登錄時間過長及不固定的情況，掃臉登錄系統(tǒng)采用用戶名和人臉特征信息組合的方式進行登錄。采取這種方式可以實現(xiàn)系統(tǒng)點對點的人臉信息比對校驗，即用戶在前端頁面提交的人臉信息只與用戶在前端提交的用戶名所屬在后臺數(shù)據(jù)庫的人臉特征信息進行比對，比對小于設定閾值即登錄成功。這種做法也符合支付寶等主流移動應用支付在做掃臉支付時用戶應同時輸入人臉特征信息和用戶的手機尾號共同登錄，才能成功完成支付功能。

5 實驗環(huán)境

本實驗環(huán)境系統(tǒng)平臺是Window10 64位系統(tǒng)，處理器型號是Intel I77500U，運行內(nèi)存16GB，顯卡型號為RTX2060。系統(tǒng)前端頁面使用Google瀏覽器進行渲染，系統(tǒng)后端解釋器及該系統(tǒng)設計所需主要框架的版本號如表1所示。

表1 解釋器及框架版本號

6 結(jié)束語

本文主要設計和完成了基于Flask框架Web版掃臉登錄系統(tǒng)用戶注冊、登錄、以及掃臉注冊和登錄的全部功能。在傳統(tǒng)登錄方式中，采用用戶名和密碼進行登錄。在掃臉登錄模式中，人臉作為用戶密碼，而人臉可以由用戶自行選擇。在整個調(diào)試過程中，本系統(tǒng)具有識別速度快、兼容傳統(tǒng)登錄和注冊方式、實時性強等特點，具有一定的研究和參考價值。