Vytvoření aplikace React Native pro přidání uživatelů do služby Rozpoznávání tváře

Tato příručka vám ukáže, jak začít s ukázkovou aplikací pro registraci tváří. Aplikace předvádí osvědčené postupy pro získání smysluplného souhlasu s přidáním uživatelů do služby rozpoznávání tváře a získání vysoce kvalitních dat o obličeji. Integrovaný systém by mohl pomocí takové aplikace poskytovat bezdotykové řízení přístupu, identifikaci, sledování docházky nebo osobního veřejného terminálu na základě údajů o tvářích.

Když uživatelé aplikaci spustí, zobrazí se podrobná obrazovka souhlasu. Pokud uživatel udělí souhlas, aplikace ho vyzve k zadání uživatelského jména a hesla a pak pomocí fotoaparátu zařízení zachytí vysoce kvalitní obrázek tváře.

Ukázková aplikace je napsaná pomocí JavaScriptu a architektury React Native. Dá se nasadit na zařízení s Androidem a iOSem.

Požadavky

• Předplatné Azure – vytvořte si ho zdarma.
• Jakmile budete mít předplatné Azure, vytvořte prostředek rozpoznávání tváře na webu Azure Portal, abyste získali klíč a koncový bod. Po nasazení vyberte Přejít k prostředku.
  • K připojení aplikace k rozhraní API pro rozpoznávání tváře budete potřebovat klíč a koncový bod z prostředku, který jste vytvořili.

Důležité

Aspekty zabezpečení

• Pro místní vývoj a počáteční omezené testování je přijatelné (i když není osvědčeným postupem) používat proměnné prostředí k uložení klíče a koncového bodu rozhraní API. V případě pilotního a konečného nasazení by se klíč rozhraní API měl bezpečně uložit – což pravděpodobně zahrnuje použití zprostředkující služby k ověření tokenu uživatele vygenerovaného během přihlášení.
• Nikdy neukládejte klíč rozhraní API nebo koncový bod v kódu nebo je potvrďte do systému správy verzí (např. Git). Pokud k tomu dojde omylem, měli byste okamžitě vygenerovat nový klíč nebo koncový bod rozhraní API a odvolat předchozí klíč.
• Osvědčeným postupem je mít samostatné klíče rozhraní API pro vývoj a produkci.

Nastavení vývojového prostředí

Android

1. Naklonujte úložiště Git pro ukázkovou aplikaci.

2. Pokud chcete nastavit vývojové prostředí, postupujte podle dokumentace React Native . Vyberte Rychlý start k rozhraní příkazového řádku React Native. Jako cílový operační systém vyberte váš vývojový operační systém a Android . Dokončete části Instalace závislostí a vývojového prostředí Pro Android.

3. Stáhněte si preferovaný textový editor, například Visual Studio Code.

4. Načtěte koncový bod a klíč FaceAPI na webu Azure Portal na kartě Přehled vašeho prostředku. Nezaškrtávejte klíč rozhraní API pro rozpoznávání tváře do vzdáleného úložiště.

   Upozorňující

   Pouze pro místní vývoj a testování můžete zadat klíč rozhraní API a koncový bod jako proměnné prostředí. V případě konečného nasazení uložte klíč rozhraní API do zabezpečeného umístění a nikdy do kódu nebo proměnných prostředí. Další způsoby ověřování služby najdete v průvodci ověřováním služeb Azure AI.

5. Spusťte aplikaci pomocí emulátoru virtuálního zařízení s Androidem ze sady Android Studio nebo vlastního zařízení s Androidem. Pokud chcete otestovat aplikaci na fyzickém zařízení, postupujte podle příslušné dokumentace React Native .

iOS

1. Naklonujte úložiště Git pro ukázkovou aplikaci.

2. Pokud chcete nastavit vývojové prostředí, postupujte podle dokumentace React Native . Vyberte Rychlý start k rozhraní příkazového řádku React Native. Jako cílový operační systém vyberte macOS a iOS . Dokončete část Instalace závislostí.

3. Stáhněte si preferovaný textový editor, například Visual Studio Code. Budete také muset stáhnout Xcode.

4. Načtěte koncový bod a klíč FaceAPI na webu Azure Portal na kartě Přehled vašeho prostředku.

   Upozorňující

   Pouze pro místní vývoj a testování můžete zadat klíč rozhraní API a koncový bod jako proměnné prostředí. V případě konečného nasazení uložte klíč rozhraní API do zabezpečeného umístění a nikdy do kódu nebo proměnných prostředí. Další způsoby ověřování služby najdete v průvodci ověřováním služeb Azure AI.

5. Spusťte aplikaci pomocí simulovaného zařízení z Xcode nebo vlastního zařízení s iOSem. Pokud chcete otestovat aplikaci na fyzickém zařízení, postupujte podle příslušné dokumentace React Native .

Přizpůsobení aplikace pro vaši firmu

Teď, když jste si nastavili ukázkovou aplikaci, ji můžete přizpůsobit vašim potřebám.

Můžete například chtít na stránku pro vyjádření souhlasu přidat informace specifické pro konkrétní situaci:

1. Přidejte další pokyny ke zlepšení přesnosti ověřování.

   Mnoho problémů s rozpoznáváním tváře je způsobeno málo kvalitními referenčními obrázky. Mezi faktory, které mohou snížit výkon modelu, patří:

   • Velikost tváře (tváře vzdálené od fotoaparátu)
   • Orientace tváře (otočené nebo nakloněné tváře od fotoaparátu)
   • Špatné podmínky osvětlení (nízké osvětlení nebo podsvícení), kde může být obrázek špatně vystavený nebo příliš velký šum
   • Okluze (částečně skryté nebo obstrukované tváře), včetně příslušenství, jako jsou klobouky nebo silné rimmované brýle
   • Rozostření (například rychlým pohybem obličeje při pořízení fotografie)

   Služba poskytuje kontroly kvality obrázků, které vám pomůžou zvolit, jestli má obrázek dostatečnou kvalitu na základě výše uvedených faktorů pro přidání zákazníka nebo pokusu o rozpoznávání tváře. Tato aplikace ukazuje, jak získat přístup k snímkům z fotoaparátu zařízení, zjistit kvalitu a zobrazit zprávy uživatelského rozhraní uživateli, aby jim pomohl zachytit kvalitnější obrázek, vybrat snímky nejvyšší kvality a přidat rozpoznanou tvář do služby rozhraní API pro rozpoznávání tváře.

   

2. Ukázková aplikace nabízí funkce pro odstranění informací o uživateli a možnost čtení. Tyto operace můžete povolit nebo zakázat na základě vašeho obchodního požadavku.

   

   Pokud chcete rozšířit funkčnost aplikace tak, aby zahrnovala kompletní prostředí, přečtěte si přehled dalších funkcí pro implementaci a osvědčené postupy.

3. Konfigurace databáze pro mapování jednotlivých osob s JEJICH ID

   K uložení obrázku tváře spolu s uživatelskými metadaty musíte použít databázi. Číslo sociálního pojištění nebo jiný jedinečný identifikátor osoby lze použít jako klíč k vyhledání id tváře.

4. Informace o zabezpečených metodách předání klíče předplatného a koncového bodu do služby Rozpoznávání tváře najdete v průvodci zabezpečením služeb Azure AI.

Nasazení aplikace

Android

Nejprve se ujistěte, že je vaše aplikace připravená pro produkční nasazení: odeberte z kódu aplikace všechny klíče nebo tajné kódy a ujistěte se, že jste postupovali podle osvědčených postupů zabezpečení.

Až budete připravení vydat aplikaci pro produkční prostředí, vygenerujete soubor APK připravený k vydání verze, což je formát souboru balíčku pro aplikace pro Android. Tento soubor APK musí být podepsaný privátním klíčem. V tomto buildu vydané verze můžete aplikaci začít distribuovat přímo do zařízení.

Postupujte podle dokumentace k přípravě k vydání verze a zjistěte, jak vygenerovat privátní klíč, podepsat aplikaci a vygenerovat soubor APK verze.

Jakmile vytvoříte podepsaný soubor APK, přečtěte si dokumentaci k publikování aplikace a přečtěte si další informace o tom, jak aplikaci uvolnit.

iOS

Nejprve se ujistěte, že je vaše aplikace připravená pro produkční nasazení: odeberte z kódu aplikace všechny klíče nebo tajné kódy a ujistěte se, že jste postupovali podle osvědčených postupů zabezpečení. K přípravě na distribuci budete muset vytvořit ikonu aplikace, úvodní obrazovku a nakonfigurovat nastavení informací o nasazení. Podle dokumentace z Xcode připravte aplikaci na distribuci.

Až budete připraveni vydat aplikaci pro produkční prostředí, vytvoříte archiv aplikace. Postupujte podle dokumentace k Xcode, jak vytvořit archivní sestavení a možnosti distribuce aplikace.

Další kroky

V této příručce jste se dozvěděli, jak nastavit vývojové prostředí a začít s ukázkovou aplikací. Pokud s React Native začínáte, můžete si přečíst jejich úvodní dokumentaci , kde najdete další informace na pozadí. Také může být užitečné seznámit se s rozhraním API pro rozpoznávání tváře. Než začnete s vývojem, přečtěte si další části o přidávání uživatelů.