建置 React Native 應用程式以將使用者新增至臉部辨識服務
本指南將為您展示如何開始使用範例臉部註冊應用程式。 此應用程式會示範取得有意義同意的最佳做法,以將使用者新增至臉部辨識服務並取得高品質臉部資料。 整合式系統可以使用像這樣的應用程式,根據其臉部資料提供無觸控存取控制、身分識別、出席追蹤或個人化資訊亭。
當使用者啟動應用程式時,會顯示詳細的同意畫面。 如果使用者同意,則應用程式會提示其輸入使用者名稱和密碼,然後使用裝置的相機來擷取高品質的臉部影像。
範例應用程式是使用 JavaScript 和 React Native 架構撰寫的。 它可以部署在 Android 和 iOS 裝置上。
必要條件
- Azure 訂用帳戶 – 建立免費帳戶。
- 擁有 Azure 訂用帳戶之後,在 Azure 入口網站中建立臉部資源,以取得您的金鑰和端點。 在其部署後,選取 [前往資源]。
- 您需要來自所建立資源的金鑰和端點,以將應用程式連線至臉部 API。
重要
安全性考量
- 針對本機開發和初始有限測試,使用環境變數來保存 API 金鑰和端點,這是可接受的 (雖然不是最佳做法)。 針對試驗和最終部署,應該安全地儲存 API 金鑰,這可能涉及使用中繼服務,來驗證登入期間所產生的使用者權杖。
- 永不要將 API 金鑰或端點儲存在程式碼中,或將它們認可至版本控制系統 (例如 Git)。 如果不小心發生此情況,您應該立即產生新的 API 金鑰/端點,並撤銷先前的 API 金鑰/端點。
- 最佳做法是考慮具有個別的 API 金鑰,以進行開發和生產。
設定開發環境
複製範例應用程式的 Git 存放庫。
若要設定您的開發環境,請遵循 React Native 文件。 選取 [React Native CLI 快速入門]。 選取您的開發 OS 和 Android 作為目標 OS。 完成 [安裝相依性] 和 [Android 開發環境] 區段。
下載您偏好的文字編輯器,例如 Visual Studio Code。
在資源的 [概觀] 索引標籤下,擷取 Azure 入口網站中您的 FaceAPI 端點和金鑰。 請不要將臉部 API 金鑰存回至遠端存放庫。
警告
僅針對本機開發和測試,您可以輸入 API 金鑰和端點為環境變數。 針對最終部署,將 API 金鑰儲存在安全位置中,而且永不會將其儲存在程式碼或環境變數中。 如需驗證服務的其他方式,請參閱 Azure AI 服務驗證指南 。
從 Android Studio 或您自己的 Android 裝置中,使用 Android 虛擬裝置模擬器來執行應用程式。 若要在實體裝置上測試您的應用程式,請遵循相關的 React Native 文件。
為您的企業自訂應用程式
現在您已設定範例應用程式,可以根據自己的需求調整該應用程式。
例如,您可能會想要在同意頁面上新增狀況特定資訊:
新增更多指示以改善驗證正確性。
許多臉部辨識問題都是由低品質的參考影像所引起的。 可能降低模型效能的一些因素如下:
- 臉部大小 (遠離相機的臉部)
- 臉部方向 (臉部遠離相機轉向或傾斜)
- 燈光不良狀況 (低光源或背光),其中影像可能曝光不佳或有過多的雜訊
- 遮擋 (部分隱藏或遭阻擋的臉部),包含像是帽子或厚框眼鏡等配件
- 模糊 (例如拍攝相片時臉部快速移動所引起)。
此服務提供影像品質檢查,以協助您根據上述因素來選擇影像的品質是否足以新增客戶或嘗試臉部辨識。 此應用程式示範如何從裝置的相機存取畫面、偵測品質並向使用者顯示使用者介面訊息以協助他們擷取更高品質的影像、選取最高品質的片幅,以及將偵測到的臉部新增至臉部 API 服務。
樣本應用程式提供刪除使用者資訊的功能,以及重新新增的選項。 您可以根據您的業務需求來啟用或停用這些作業。
若要延伸應用程式的功能以涵蓋完整的體驗,請參閱概觀以取得要實作的其他功能和最佳做法。
設定您的資料庫以對應每位人員及其識別碼
您必須使用資料庫來儲存臉部影像以及使用者中繼資料。 社會安全號碼或其他唯一人員識別碼可用來作為金鑰來查閱其臉部識別碼。
如需將訂用帳戶金鑰和端點傳遞至臉部服務的安全方法,請參閱 Azure AI 服務安全性指南。
部署應用程式
首先,請確定您的應用程式已準備好進行生產部署:從應用程式程式碼中移除任何金鑰或秘密,並確定您已遵循安全性最佳做法。
當準備好要發行應用程式以進行生產時,您將會產生可供發行的 APK 檔案,這是適用於 Android 應用程式的套件檔案格式。 這個 APK 檔案必須以私密金鑰簽署。 使用這個發行組建,您可以開始將應用程式直接散發至您的裝置。
請遵循準備發行文件,了解如何產生私密金鑰、簽署您的應用程式,以及產生發行 APK。
建立已簽署的 APK 之後,請參閱發佈您的應用程式文件,深入了解如何發行您的應用程式。
下一步
在本指南中,您已了解如何設定您的開發環境,以及如何開始使用範例應用程式。 如果您不熟悉 React Native,則可以閱讀其入門文件,以深入了解背景資訊。 其也可能有助於讓您熟悉臉部 API。 在開始開發之前,請閱讀其他有關新增使用者的章節。