Skip to content

Instantly share code, notes, and snippets.

@HERYORDEJY
Last active November 24, 2023 07:49
Show Gist options
  • Select an option

  • Save HERYORDEJY/24c8debf1089a0cbefa8a0ae7c88ec16 to your computer and use it in GitHub Desktop.

Select an option

Save HERYORDEJY/24c8debf1089a0cbefa8a0ae7c88ec16 to your computer and use it in GitHub Desktop.
React Native Face-ID Authentication implementation
/*--------------------
Using the react-native-biometrics package
----------------------*/
import React, { useEffect, useState } from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import Biometrics from 'react-native-biometrics';
const FaceIDAuthentication = () => {
const [biometryType, setBiometryType] = useState(null);
useEffect(() => {
Biometrics.isSensorAvailable()
.then((result) => {
if (result.biometryType === 'FaceID' || result.biometryType === 'TouchID') {
setBiometryType(result.biometryType);
}
})
.catch((error) => {
console.error(error);
});
}, []);
const handleAuthentication = () => {
Biometrics.simplePrompt('Authenticate with Face ID')
.then((result) => {
if (result.success) {
console.log('Authentication successful');
// Handle successful authentication
} else {
console.log('Authentication failed');
// Handle authentication failure
}
})
.catch((error) => {
console.error(error);
});
};
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
{biometryType && (
<Text>{`Biometry Type: ${biometryType === 'FaceID' ? 'Face ID' : 'Touch ID'}`}</Text>
)}
<TouchableOpacity onPress={handleAuthentication}>
<Text>Authenticate with {biometryType === 'FaceID' ? 'Face ID' : 'Touch ID'}</Text>
</TouchableOpacity>
</View>
);
};
export default FaceIDAuthentication;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment