'How to check support of Touch ID, Face Id ,Password and pattern lock in React-Native

I have implemented a react-native-fingerprint-scanner, it's working for Touch Id.

Now I wanted to add authentication for Touch ID, Face Id, Passcode for both platform

Is there any way to check whether your device support or not. Also, I have tried using react-native-touch-id but it is not for Face Id on android.

Is there any way to achieve this for both platforms (iOS/Android)?

Reference:Link

enter image description here

enter image description here



Solution 1:[1]

react-native-touch-id should work for both TouchID and FaceID.

iOS allows the device to fall back to using the passcode, if faceid/touch is not available. this does not mean that if touchid/faceid fails the first few times it will revert to passcode, rather that if the former are not enrolled, then it will use the passcode.

from the docs

You can check to see if its supported first.

const optionalConfigObject = {
  fallbackLabel: 'Show Passcode', 
  passcodeFallback: true,
}

TouchID.isSupported(optionalConfigObject)
  .then(biometryType => {
    // Success code
    if (biometryType === 'FaceID') {
        console.log('FaceID is supported.');
    } else {
        console.log('TouchID is supported.');
    }
  })
  .catch(error => {
    // Failure code
    console.log(error);
  });

Solution 2:[2]

react-native-touch-id supports FaceId too. But, is not actively maintained anymore. So, they recommend to use expo local authentication. It works in all react native applications regardless of expo or not.

To use this, first you have to install react-native-unimodules. follow this guide https://docs.expo.io/bare/installing-unimodules/

Once it is installed you can install it by

npm install expo-local-authentication

add following line to your import

import LocalAuthentication from 'expo-local-authentication';

After that, we can use it.

async function biometricAuth(){
  const compatible = await LocalAuthentication.hasHardwareAsync();
  if (compatible) {
    const hasRecords = await LocalAuthentication.isEnrolledAsync();
    if (hasRecords) {
      const result = await LocalAuthentication.authenticateAsync();
      return result;
    }
  }
}

It will automatically choose between available local authentication (TouchID, FaceID, Number lock, Pattern lock etc) and authenticate the user.

Solution 3:[3]

enter image description here // use this package import RNBiometrics from "react-native-simple-biometrics"; this is both for touchId and passcode for android and ios

Solution 4:[4]

//this code is for checking whether touch id is supported or not
    TouchID.isSupported()
          .then(biometryType => {
            // Success code
            if (biometryType === 'FaceID') {
              console.log('FaceID is supported.');
            } else if (biometryType === 'TouchID'){
              console.log('TouchID is supported.');
            } else if (biometryType === true) {
              // Touch ID is supported on Android
        }
          })
          .catch(error => {
            // Failure code if the user's device does not have touchID or faceID enabled
            console.log(error);
          });

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Sagar
Solution 3
Solution 4