React Native 생체인증 사용하기 (react-native-biometrics)

React Native의 생체인증을 사용하기 위해서 라이브러리를 설치하였다.

사용한 라이브러리는 react-native-biometrics다.

 

Face Id 인증 구현 예시

import ReactNativeBiometrics, {BiometryTypes} from 'react-native-biometrics';

const onClickAuth = useCallback(async () => {
    const rnBiometrics = new ReactNativeBiometrics({
      allowDeviceCredentials: true,
    });

    const {biometryType} = await rnBiometrics.isSensorAvailable();
    console.log('biometryType', biometryType);
    if (biometryType === BiometryTypes.FaceID) {
      rnBiometrics
        .simplePrompt({promptMessage: 'Confirm FaceID'})
        .then(resultObject => {
          const {success} = resultObject;
          if (success) {
            console.log('successful biometrics provided');
          } else {
            console.log('user cancelled biometric prompt');
          }
        })
        .catch(() => {
          console.log('biometrics failed');
        });
    }
}, []);

에시로 아이폰의 face id 기능을 테스트해봤다.

로직의 순서로는

1. 기기가 face id를 지원하는지 확인

2. face id를 사용하기 위한 prompt를 띄운다.

3. 사용자가 face id 인증한 결과에 따라서 다른 로직을 실행한다.

 

처음에는 react-native-keychain을 사용하여 해당 기능을 구현하고자 하였는데, 생각처럼 잘 작동하지 않아 다른 라이브러리를 사용하여 생체 인증을 구현하기로 하였다.