Android: Error: Fingerprint operation canceled, iOS no response

[JeffreyLeeDave]

1. I keep getting this Error: Fingerprint operation canceled.. It happens on the SInfo.setItem because I do see start getting logged. I kinda just followed what it says on the docs. I can't see why it doesn't work. This only happens on Android.

2. On iOS I see the biometrics prompt, but I get nothing from SInfo.getItem

  useEffect(() => {
    async function testingLocalAuthentication() {
      try {
        console.log('start');
        const setData = await SInfo.setItem('key1', 'secretStuff', {
          sharedPreferencesName: 'mySharedPrefs',
          keychainService: 'myKeychain',
          touchID: true, //add this key
          kSecAccessControl: 'kSecAccessControlBiometryAny',
        });
        console.log('------------setData: ', setData);
        const response = await SInfo.getItem('key1', {
          touchID: true,
          showModal: true, //required (Android) - Will prompt user's fingerprint on Android
          strings: {
            // optional (Android) - You can personalize your prompt
            description: 'Custom Title ',
            header: 'Custom Description',
          },
          // required (iOS) -  A fallback string for iOS
          kSecUseOperationPrompt: 'We need your permission to retrieve encrypted data',
        });
        console.log('------------response: ', response);
      } catch (error) {
        console.log(error);
      }
    }
    testingLocalAuthentication();
  });

[mCodex]

@JeffreyLeeDave have you added Android permissions into your AndroidManifest.xml:

<uses-permission android:name="android.permission.USE_BIOMETRIC" />
<uses-permission android:name="android.permission.USE_FINGERPRINT" />

and recompiled your Android project?

[JeffreyLeeDave]

Yea I did. I actually already had this in my AndroidManifest.xml before as well. I was originally using the react-native-touch-id package and recently making a switch to here.

[mCodex]

Do you have any fingerprint enrolled in your Android emulator? (if you are using emulator) 🤔

[JeffreyLeeDave]

Yea fingerprint is enrolled. I confirmed this because hasEnrolledFingerprints and isSensorAvailable both return true.

[mCodex]

I was debugging here using the example project inside RNSInfo's repo. Can you please change your setItem function as follows:

        const setData = await SInfo.setItem('key1', 'secretStuff', {
          sharedPreferencesName: 'mySharedPrefs',
          keychainService: 'myKeychain',
          showModal: true, // required (Android) - Will prompt user's fingerprint on Android
          touchID: true, // add this key
          kSecAccessControl: 'kSecAccessControlBiometryAny',
        });

I've just added showModal: true and your snippet is currently working 😄

The docs should be also updated

[JeffreyLeeDave]

I wanted to add that after doing some more digging around, if I do getAllItems, I do see this in the list of stuff stored:

{service: "myKeychain", key: "key1", value: "secretStuff"}

I also tried to store it without the keychainService and I added this into the array as well:

{service: "app", key: "key1", value: "secretStuff"}

In addition, SInfo.setItem does resolve to secretStuff. And SInfo.getItem does get something if I removed all the optional arguments there.

EDIT:
We were typing at the same time. Let me try the changes you proposed above and I will get back to you on that.

EDIT 2: I just wanted to point out this block of stuff I just mentioned was in regards to iOS. I am going to update my original post to enumerate the issues so it's clear there are two things going on

[JeffreyLeeDave]

Ok adding showModal on the setItem caused the app to crash on me. I am on the latest version btw. Just to be clear, this is what it looks like now:

  useEffect(() => {
    async function testingLocalAuthentication() {
      try {
        console.log('start');
        const setData = await SInfo.setItem('key1', 'secretStuff', {
          sharedPreferencesName: 'mySharedPrefs',
          keychainService: 'myKeychain',
          showModal: true, // required (Android) - Will prompt user's fingerprint on Android
          touchID: true, // add this key
          kSecAccessControl: 'kSecAccessControlBiometryAny',
        });
        console.log('------------setData: ', setData);
        const response = await SInfo.getItem('key1', {
          touchID: true,
          showModal: true, //required (Android) - Will prompt user's fingerprint on Android
          strings: {
            // optional (Android) - You can personalize your prompt
            description: 'Custom Title ',
            header: 'Custom Description',
          },
          // required (iOS) -  A fallback string for iOS
          kSecUseOperationPrompt: 'We need your permission to retrieve encrypted data',
        });
        console.log('------------response: ', response);
      } catch (error) {
        console.log(error);
      }
    }
    testingLocalAuthentication();
  });

[mCodex]

I'm debugging here too. On Android I was able to fix it by adding showModal: true as I mentioned above

Right now, I'm building the example app on iOS to check what it happened.

[JeffreyLeeDave]

Out of curiosity, were you able to fix this on the android emulator by having this in a useEffect or did you do the useCallback as shown in the example app. Just curious.

[mCodex]

Out of curiosity, were you able to fix this on the android emulator by having this in a useEffect or did you do the useCallback as shown in the example app. Just curious.

Using the same useEffect you provided

iOS (Tested on Iphone 11 emulator)

Probably a bug, using your sample code the data couldn't be retrieved. It always return "undefined". However, I was able to accomplish that removing the touchId: true from getItem. However, this is not right.

Created a dedicated issue here #233

[JeffreyLeeDave]

Ok well it's good to know that at least we are on the same page in regards to the iOS simulator, but I am still having the same issue on Android. Adding the showModal: true still causes my app to crash. I tried to strip down as bare as possible. My component now looks like this:

const Home: FunctionComponent = () => {
  useEffect(() => {
    async function testingLocalAuthentication() {
      try {
        console.log('start');
        const setData = await SInfo.setItem('key1', 'secretStuff', {
          sharedPreferencesName: 'mySharedPrefs',
          keychainService: 'myKeychain',
          // showModal: true, // required (Android) - Will prompt user's fingerprint on Android
          touchID: true, // add this key
          // showModal: true,
          kSecAccessControl: 'kSecAccessControlBiometryAny',
        });
        console.log('------------setData: ', setData);
        const response = await SInfo.getItem('key1', {
          touchID: true,
          showModal: true, //required (Android) - Will prompt user's fingerprint on Android
          strings: {
            // optional (Android) - You can personalize your prompt
            description: 'Custom Title ',
            header: 'Custom Description',
          },
          // required (iOS) -  A fallback string for iOS
          kSecUseOperationPrompt: 'We need your permission to retrieve encrypted data',
        });
        console.log('------------response: ', response);
      } catch (error) {
        console.log(error);
      }
    }
    testingLocalAuthentication();
  });

  return (
    <View>
      <Text>stuff</Text>
    </View>
  );
}

export default Home;

This renders, but does nothing. If I uncomment showModal from the setItem. I still get a crash. I even created a new emulator on Android Studio with Pixel 3XL and API 29.

[JeffreyLeeDave]

I would also like to add I tested this on an actual device, Pixel 3XL, today and it still crashes for me

[JeffreyLeeDave]

Update, I am using version 6.0.0-alpha.5 now and on a physical device and I do see the fingerprint prompt on android. However I ran into the same issue as iOS where the decrypted response is undefined.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[douglasjunior]

Hello guys, this library still maintained?