How to add fingerprint (Touch ID) to a React-Native app?

Question

I have not been able to find a solution to Touch ID using React-Native. I am only able to sign in to the app using a finger enrolled in the device, but how can I actually enroll a new finger to use ONLY for authenticating with that app?

Do I understand properly? you wanna add a new fingerprint buy using your application? while it is the OS duty. — AmerllicA, Apr 09 '20 at 00:20
@AmerllicA I want to enrol a fingerprint that will serve only for authenticating with my RN app, can I do that using React-Native? — , Apr 09 '20 at 00:35
There is not React Native issue, There is a question at the first. Could we have a fingerprint enrolling inside an app? even native Android/iOS. I guess the answer to the question is **NO**, the fingerprint should be declared by OS, and it is safe done by OS, not an application. why the OS owners should make a device and provide it to us? I think it is not possible. — AmerllicA, Apr 09 '20 at 00:44
@AmerllicA the reason why i really need to do so is because I want the fingerprint that opens this app to be permanently unique. The user is able to go to Device settings and change the fingerprint so it can sign in to the app using the new fingerprint. Maybe it would be good if I would be able to retrive the fingerprint data and save it in the server so I can always check if it has changed. What do you think? I am using `react-native-fingerprint-scanner` — , Apr 09 '20 at 00:54

score 0 · Accepted Answer · answered Apr 09 '20 at 01:03

0

Definitely, behind the React Native libraries, there are Android/iOS native codes. and in both of them, the given device API allows the developers to use the fingerprint saved data to authenticate. you cannot get the fingerprint data and keep it on your application or server. for more information, you can see this post.

So, because of the limitation on the native side, the React Native cannot get the fingerprint data.

It is not possible.

answered Apr 09 '20 at 01:03

AmerllicA

29,059
15
130
154

Is there a way to at least check if the enrolled finger has changed? – Apr 09 '20 at 01:29
1

In fact, it is a deep native side question. In my country, time is 6 A.M. and I didn't sleep last night. please give me time to ask my Android/iOS developer friends and definitely I will add the answer to my post. check the post in 10 hours later. – AmerllicA Apr 09 '20 at 01:43
I appreciate it, however, if this is not possible only by using RN then its a no go for me since it would take time and I don't even have any knowledge in Swift. – Apr 09 '20 at 02:14
1

Dear @bmmf, I asked your question about finding changes in fingerprint enrolling on OS. both of my friends the iOS developer and the Android developer said there is no way to do that, there is just an API to tell you the current user finger passed Auth or not. – AmerllicA Apr 09 '20 at 13:54

score 0 · Answer 2 · answered Nov 20 '20 at 11:00

    //this is for checking suppport of face id and touch id on your device
        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 
                console.log(error);
              });
   // this is for applying touch id
    TouchID.isSupported()
      .then(authenticate)
      .catch(error => {
        AlertIOS.alert('TouchID not supported');
      });

score 0 · Answer 3 · answered Aug 01 '23 at 05:31

import TouchID from 'react-native-touch-id';



const optionalConfigObject = {
      title: 'Authentication Required', // Android
      color: 'ffffff', // Android,
      fallbackLabel: 'Show Passcode', // iOS (if empty, then label is hidden)
    };



TouchID.isSupported()
      .then(biometryType => {
        // Success code
        if (biometryType === 'FaceID') {
          console.log('FaceID is supported.');
        } else {
          console.log('TouchID is supported.');
          TouchID.authenticate('Authenticate', optionalConfigObject)
            .then(success => {
              Alert.alert('Authenticated Successfully');
            })
            .catch(error => {
              Alert.alert('Authentication Failed', error.toString());
            });
        }
      })
      .catch(error => {
        // Failure code
        Alert.alert('No TouchId and FaceId Detected in this device');
      });

that's all... enjoy your coding...

How to add fingerprint (Touch ID) to a React-Native app?

3 Answers3