Face 서비스에 사용자를 추가하는 React Native 앱 빌드

이 가이드에서는 샘플 Face 등록 애플리케이션을 시작하는 방법을 보여줍니다. 이 앱은 사용자를 얼굴 인식 서비스에 추가하고 고품질 얼굴 데이터를 획득하기 위한 의미 있는 동의를 얻기 위한 모범 사례를 보여 줍니다. 통합 시스템은 이와 같은 앱을 사용하여 얼굴 데이터를 기반으로 터치리스 액세스 제어, 식별, 출석 추적 또는 개인 설정 키오스크를 제공할 수 있습니다.

사용자가 앱을 시작하면 자세한 동의 화면이 표시됩니다. 사용자가 동의하면 앱에서 사용자 이름 및 암호를 묻는 메시지를 표시한 다음 디바이스의 카메라를 사용하여 고품질 얼굴 이미지를 캡처합니다.

샘플 앱은 JavaScript 및 React Native 프레임워크를 사용하여 작성되었습니다. Android 및 iOS 디바이스에 배포할 수 있습니다.

필수 조건

Important

보안 고려 사항

  • 로컬 개발 및 초기 제한된 테스트의 경우 환경 변수를 사용하여 API 키와 엔드포인트를 보유하는 것이 좋습니다(모범 사례는 아님). 파일럿 및 최종 배포의 경우 API 키를 안전하게 저장해야 합니다. 여기에는 중간 서비스를 사용하여 로그인 중에 생성된 사용자 토큰의 유효성을 검사하는 작업이 포함될 수 있습니다.
  • API 키 또는 엔드포인트를 코드에 저장하거나 버전 제어 시스템(예: Git)에 커밋하지 마세요. 실수로 발생하는 경우 즉시 새 API 키/엔드포인트를 생성하고 이전 API 키/엔드포인트를 해지해야 합니다.
  • 개발 및 프로덕션을 위해 별도의 API 키를 사용하는 것이 가장 좋습니다.

개발 환경 설정

  1. 샘플 앱에 대한 git 리포지토리를 복제합니다.

  2. 개발 환경을 설정하려면 React Native 설명서를 따릅니다. React Native CLI 빠른 시작을 선택합니다. 개발 OS 및 Android 를 대상 OS로 선택합니다. 종속성 및 Android 개발 환경 설치 섹션을 완료합니다.

  3. Visual Studio Code와 같은 원하는 텍스트 편집기를 다운로드합니다.

  4. 리소스의 개요 탭에 있는 Azure Portal에서 FaceAPI 엔드포인트 및 키를 검색할 수 있습니다. Face API 키를 원격 리포지토리에 체크 인하지 마십시오.

    Warning

    로컬 개발 및 테스트에만 API 키와 엔드포인트를 환경 변수로 입력할 수 있습니다. 최종 배포의 경우 API 키를 안전한 위치에 저장하고 코드 또는 환경 변수에 저장하지 않습니다. 서비스를 인증하는 다른 방법은 Azure AI 서비스 인증 가이드를 참조하세요.

  5. Android Studio의 Android 가상 디바이스 에뮬레이터 또는 사용자 고유의 Android 디바이스를 사용하여 앱을 실행합니다. 물리적 디바이스에서 앱을 테스트하려면 관련 React Native 설명서를 따릅니다.

비즈니스용 앱 사용자 지정

이제 샘플 앱을 설정했으므로 사용자 고유의 요구에 맞게 조정할 수 있습니다.

예를 들어 동의 페이지에서 상황에 맞는 정보를 추가하려고 할 수 있습니다.

app consent page

  1. 더 많은 지침을 추가하여 확인 정확도를 향상시킵니다.

    많은 얼굴 인식 문제는 저품질 참조 이미지로 인해 발생합니다. 모델 성능을 저하시킬 수 있는 몇 가지 요인은 다음과 같습니다.

    • 얼굴 크기(카메라에서 멀리 떨어진 얼굴)
    • 얼굴 방향(얼굴을 설정하거나 카메라에서 멀리 기울어짐)
    • 이미지가 제대로 노출되지 않거나 노이즈가 너무 많을 수 있는 열악한 조명 조건(저조도 또는 백라이트)
    • 모자 나 두꺼운 테두리 안경과 같은 액세서리를 포함하여 폐색 (부분적으로 숨겨지거나 가려진 얼굴)
    • 흐림(예: 사진을 찍을 때의 빠른 얼굴 움직임).

    이 서비스는 이미지의 품질이 고객을 추가하거나 얼굴 인식을 시도하기 위해 위의 요인에 따라 이미지가 충분한 품질인지 여부를 선택하는 데 도움이 되는 이미지 품질 검사를 제공합니다. 이 앱은 디바이스의 카메라에서 프레임에 액세스하고, 품질을 감지하고, 사용자에게 사용자 인터페이스 메시지를 표시하여 더 높은 품질의 이미지를 캡처하고, 최고 품질의 프레임을 선택하고, 감지된 얼굴을 Face API 서비스에 추가하는 방법을 보여 줍니다.

    app image capture instruction page

  2. 샘플 앱은 사용자의 정보를 삭제하는 기능과 읽을 수 있는 옵션을 제공합니다. 비즈니스 요구 사항에 따라 이러한 작업을 사용하거나 사용하지 않도록 설정할 수 있습니다.

    profile management page

    전체 환경을 포함하도록 앱의 기능을 확장하려면 구현할 추가 기능 및 모범 사례에 대한 개요를 읽어보세요.

  3. 각 사용자를 ID로 매핑하도록 데이터베이스 구성

    사용자 메타데이터와 함께 얼굴 이미지를 저장하려면 데이터베이스를 사용해야 합니다. 사회 보장 번호 또는 기타 고유 인물 식별자를 키로 사용하여 얼굴 ID를 조회할 수 있습니다.

  4. 구독 키와 엔드포인트를 Face 서비스에 전달하는 안전한 방법은 Azure AI 서비스 보안 가이드를 참조하세요.

앱 배포하기

먼저 앱이 프로덕션을 배포할 준비가 되었는지 확인합니다. 앱 코드에서 키 또는 비밀을 제거하고 보안 모범 사례를 따르고 있는지 확인합니다.

프로덕션용으로 앱을 릴리스할 준비가 되면 Android 앱용 패키지 파일 형식인 릴리스 준비 APK 파일을 생성합니다. 이 APK 파일은 프라이빗 키로 서명해야 합니다. 이 릴리스 빌드를 사용하면 디바이스에 직접 앱을 배포할 수 있습니다.

릴리스 준비 설명서에 따라 프라이빗 키를 생성하고, 애플리케이션에 서명하고, 릴리스 APK를 생성하는 방법을 알아봅니다.

서명된 APK를 만든 후에는 앱 게시 설명서를 참조 하여 앱을 릴리스하는 방법에 대해 자세히 알아보세요.

다음 단계

이 가이드에서는 개발 환경을 설정하고 샘플 앱을 시작하는 방법을 알아보았습니다. React Native를 접하는 경우 시작 문서를 읽고 자세한 배경 정보를 알아볼 수 있습니다. Face API를 숙지하는 것도 도움이 될 수 있습니다. 개발을 시작하기 전에 사용자 추가에 대한 다른 섹션을 읽어보세요.