Presque toutes les purposes nécessitent désormais une identification biométrique; Ce n’est plus une choice. Les appareils iOS et alimentés par Android utilisent leur biométrie intégrée pour s’assurer que les bons mécanismes de verrouillage du téléphone sont en place.
Vos purposes doivent désormais être authentifiées pour fonctionner. Vous pouvez ouvrir beaucoup d’purposes bancaires, de messagerie et de jeu avec le même code biométrique (reconnaissance faciale, empreinte digitale). De nos jours, savoir remark fonctionne l’authentification biométrique est essential.
Authentification biométrique: qu’est-ce que c’est?
Les nombreuses caractéristiques biologiques d’une personne servent de mot de passe dans l’authentification biométrique. Pour vous permettre de lancer l’utility, par exemple, le scan de rétine seize et maintient votre rétine distinctive. De la même manière, le programme enregistre vos empreintes digitales et les utilise pour vérifier votre identité.
La majorité des programmes prennent désormais en compte la collecte de biométriques pour les aider à protéger les données, automotive les mots de passe peuvent être compromis.
L’identification est la première étape de l’authentification. Vos biométriques sont capturées pendant le scan biométrique. Ici, vous fournissez à l’utility votre identification avec vos empreintes digitales, votre voix et votre rétine.
Après avoir été capturée, cette collecte de données est utilisée par l’utility pour s’authentifier et donner accès à chaque nouvel utilisateur. Après avoir appris à propos de vous, l’utility comparera désormais les informations chaque fois que quelqu’un demande l’entrée.
La procédure associée à l’authentification biométrique
Dans ce sort d’exemple d’apprentissage automatique, les ensembles de données sont constamment comparés pour s’assurer qu’ils correspondent.
Pour activer l’utility bancaire, par exemple, vous devez saisir votre empreinte digitale sur votre smartphone. Chaque fois que vous ouvrez l’utility bancaire, votre empreinte digitale sera numérisée et comparée aux informations stockées. Vous aurez accès à l’utility en cas de match.
Quel est le processus d’authentification biométrique?
Pour saisir davantage le fonctionnement de ce processus, examinons la justification qui y entre.
Les shoppers peuvent accéder à l’utility ou à l’appareil avec l’identification biométrique en utilisant leur ID de visage ou leur identifiant. La fonction Authentication.AuthenticateSync doit être utilisée pour cela. Cette variable renvoie le succès de la valeur comme vrai ou fake lorsque vous le demandez. Cela indique que les deux ensembles conviennent si cela est vrai.
Lorsque quelqu’un essaie plus d’une fois, il partage un code qui verrouille l’écran pendant un court docket second.
{
"error": "lockout",
"message": "Too many makes an attempt. Strive yet one more later.",
"success": false
}
Le succès dans ce cas s’est révélé être une erreur. L’utilisateur a oublié le mot de passe ou ne le savait pas. En conséquence, ils ont été verrouillés à plusieurs reprises par l’utility ou l’appareil.
Le LocalAuthenticationOptions
méthode AuthenticateAsync
vous permet d’ajouter plus d’un paramètre. Ils doivent être inclus comme argument. Le code pour la même selected ressemblerait à ceci.
interface LocalAuthenticationOptions {
promptMessage?: string;
cancelLabel?: string;
deactivateGadget?: boolean;
fallbackEnabled?: boolean;
fallbackLabel?: string;
}
Examinons les implications de chacun de ces choix:
Il s’agit du message rapide qui apparaît lorsque vous êtes invité à utiliser votre biométrie pour vous connecter. Pour accéder au gadget ou à l’utility, il vous demande de scanner votre empreinte digitale ou votre rétine.
Une autre caractéristique cruciale lors de l’utilisation de la biométrie pour se connecter est CancelLabel
. Il garantit que l’invite de biométrie peut être fermée. Si vous préférez ne pas utiliser la biométrie pour la connexion, cela est utile. La fonction DisableDeviceFallback doit être définie sur TRUE pour les appareils Android.
Une fois que de nombreux essais de biométrie, vous pouvez commencer à utiliser le code d’accès grâce au disableDeviceFallback
mécanisme. Étant donné la probabilité que le gadget ne détecte pas correctement votre biométrie, cette fonctionnalité est cruciale. Vous pouvez laisser cette fonction définie sur FALSE par défaut si vous souhaitez que les consommateurs l’utilisent pour obtenir le mot de passe. Réglez-le sur True si vous souhaitez utiliser la biométrie.
FallbackLabel: vous devez définir cette fonction si votre DisabledEvicefallback est défini sur False. Vous pouvez l’utiliser pour personnaliser votre étiquette de code d’accès.
Ajout d’autorisations: lors du développement d’alternate options pour l’authentification biométrique, vous devez ajouter des autorisations. Ces autorisations sont ajoutées automatiquement au code sur Android. Pour iOS, en revanche, vous devrez inclure le code infoPlist.NSFaceIDUsageDescription
Dans le fichier app.json de l’utility Expo. Contact ID peut être ajouté au fichier app.json à l’aide d’un code comparable. Le NSFACEIDUsageDescription
Doit ensuite être entré dans cette fonction afin que l’utility valide les informations biométriques.
Remark ajouter la biométrie à l’expo?
Comme nous le savons déjà, la biométrie se evaluate souvent aux valeurs préétablies. Par conséquent, vous devrez comprendre remark inclure des informations biométriques dans votre utility.
L’set up du fichier d’authentification native dans l’utility Expo est la première étape. // Utilisation du fil du fil Ajouter une authentification exposée
// Installez l’authentification expo-locale à l’aide de NPM NPM
Pour installer la bibliothèque d’authentification locale, vous devez exécuter ce code. L’set up du package deal NPM est désormais requise pour l’authentification locale. Ce code doit être inclus en tant qu’authentification locale de «Authentification exposée» à votre importation de fichiers TypeScript ou JavaScript *.
Étape 2: Compatibilité des appareils
L’implémentation de biométrie implique un mélange de matériel et de logiciels. Vous devez déterminer si ce mécanisme d’authentification est pris en cost par le matériel. La méthode HashardWareAsync dans Expo sera utilisée pour déterminer si le matériel est synchronisé.
// Every time useState is discovered, React.useState(false) is equal to:
const [isBiometricSupported, setIsBiometricSupported] = React.useState(false);// Confirm if the system is biometric appropriate utilizing useEffect
React.useEffect(() => {
(async () => {
const appropriate = await LocalAuthentication.hasHardwareAsync();
setIsBiometricSupported(appropriate);
})();
}, []);// We conditionally current a textual content message in our JSX to let shoppers know whether or not their system helps
Est-ce qu’il soutient la biométrie? « Votre appareil est appropriate biométrique »: « Cet appareil a une empreinte digitale ou un scanner de visage »
Vous pouvez déterminer si l’appareil prend en cost la biométrie en utilisant le résultat booléen que cette méthode asynchrone renvoie en promesse.
Vous devez inclure d’autres strategies de connexion, ces codes de passe, dans votre code si la biométrie n’est pas prise en cost.
Étape # 3: Recherche de paperwork
Notez que le système recherchera une correspondance en la comparant aux informations biométriques actuelles. Le isEnrolledAsync()
La méthode peut être utilisée pour déterminer cela.
const handleBiometricAuth = async () => {
const savedBiometrics = await LocalAuthentication.isEnrolledAsync();if (!savedBiometrics) {
return Alert.alert(
"Biometric document not discovered",
"Please use your password to substantiate your id",
[
{
text: "OK",
onPress: () => fallBackToDefaultAuth(),
},
]
);
}
};
L’utility reviendra à l’autre méthode de saisie avec un mot de passe si aucune biométrie n’est enregistrée.
Utilisation de React Native pour l’implémentation biométrique
Expo dans React Native est requis pour cela. Pour extraire les modules Expo, vous devez installer les modules React-Native-UNI.
Pour implémenter l’authentification locale pour votre utility, vous utiliserez la même procédure que nous avons décrite pour Expo.
Y compris les autorisations
Cette part a déjà été couverte lors de la détermination du fonctionnement de la biométrie et des fonctionnalités supplémentaires nécessaires.
Info.plist
Description de NSFaceIDUsage
Authentification de touche ou de faceid pour $(PRODUCT_NAME)
Le code suivant doit être inclus pour iOS; Ceci est particulièrement nécessaire si vous utilisez des API qui ont un accès à l’identification du visage.
Pour Android, vous devez inclure ces lignes:
Cette part a déjà été couverte lors de la détermination du fonctionnement de la biométrie et des fonctionnalités supplémentaires nécessaires.
Y compris la biométrie dans React Native
La biométrie réactive-native doit être incluse si vous souhaitez gérer la biométrie en toute sécurité. Il utilise à la fois des strategies basées sur les résultats et même les strategies d’authentification.
Qu’est-ce que cela signifie?
La valeur booléenne à elle seule n’est pas suffisante pour l’authentification.
De plus, il garantit que l’utility reçoit une clé cryptographique, qui est envoyée au serveur pour l’authentification des utilisateurs.
Commencez par développer une utility native React si vous souhaitez utiliser cette approche pour implémenter le flux d’authentification.
Démarrez cette commande dans le répertoire racine du serveur d’purposes.
Pour lancer l’émulateur, utilisez cette commande.
Un écran qui vous information à travers la création de la fonction d’authentification apparaîtra.
L’intégrer dans votre utility est la première étape.
React-Native-Biométrie peut être installé by way of NPM ou ajouté au fil.
Les strategies suivantes doivent être utilisées afin d’intégrer efficacement l’authentification dans votre utility.
1. Providessensoravailability
La compatibilité biométrique de l’appareil devrait être la première selected que votre code recherche. Une valeur booléenne qui garantit un soutien sera retournée.
error?: string;interface IsSensorAvailableResult 'FaceID'
Pour voir si votre smartphone Android prend en cost la biométrie, entrez le code suivant.
Use’react-native-biométrie ‘pour importer des biométriques ReactNative;
Le code qui détermine le sort d’help biométrique disponible doit être saisi. Le gadget permet-il à la fois l’ID et le toucher facial, ou un seul d’entre eux?
Si l’utilisateur a enregistré à la fois l’ID de face et l’ID Contact, vous devrez désormais coder. Vous devez également vérifier les ID.
Utilisez la fonction ReactNativeBiometrics si vous utilisez iOS.Reactnative Biometrics and TouchId.faceId. Cependant, vous devez utiliser ReactNativeBiometrics si vous utilisez Android.biometrics.
Afin d’ajouter un motif ou une broche à l’émulateur, accédez à Paramètres> Sécurité> Empreinte digitale. Avant de tester la biométrique sur l’appareil, assurez-vous de vous connecter pour l’ajouter.
L’empreinte digitale doit être enregistrée. Vous devez utiliser le code suivant pour cela.
emu finger contact with adb -e
Adb -e emu finger contact 5355aw3455, for example
2. SimplePrompt
Avec la biométrie, voici votre message rapide qui apparaît à l’écran. Dans le cas où vous décidez de ne pas utiliser la biométrie pour la connexion, il fournit également un avis d’annulation. De plus, vous voulez penser à inclure un message d’erreur.
async () => {
const isBiometricSupport = async () => {
let { error, success } = await ReactNativeBiometrics.simplePrompt({
promptMessage: 'Register with Contact ID',
cancelButtonText: 'Shut',
});
console.log({ success, error });
};await isBiometricSupport();
};
En conclusion
Cette leçon a servi de manuel pour expliquer la valeur de la biométrie, remark l’inclure dans votre utility native React et son fonctionnement.
Le meilleures applications de gestion de patrimoine Fournir un suivi de portefeuille en temps réel, une planification financière automatisée et une gestion des investissements sécurisée, aidant les utilisateurs à prendre efficacement les décisions financières éclairées.
Dans le cas où vous avez trouvé une erreur dans le texte, veuillez envoyer un message à l’auteur en sélectionnant l’erreur et en appuyant sur Ctrl-enter.