0
votes

Comment implémenter React Native OTP Retriever et générer une clé de hachage pour l'application

Débutant à React natif

J'essaie de vérifier automatiquement OTP utilisant react-native-sms-retriever J'ai implémenté l'exemple suivant dans le projet

Exemple implémenté Cet exemple n'est pas une manière prouvée d'obtenir la clé de hachage. vous devez l'obtenir manuellement en exécutant la commande

Lorsque j'exécute la commande, il ne demande pas de mot de passe. Il devrait demander car ici c'est

J'ai généré la clé de hachage de débogage en utilisant la commande ci-dessous exécutée dans le dossier «java / bin». Mais ce n'est pas

keytool -exportcert -alias my-key-alias -keystore my-key.keystore | xxd -p | tr -d "[:space:]" | echo -n com.opick.app `cat` | sha256sum | tr -d "[:space:]-" | xxd -r -p | base64 | cut -c1-11

Comment générer une clé de hachage pour la version de version essayée après retourne une mauvaise clé

keytool -exportcert -alias androiddebugkey -keystore '~\.android\debug.keystore' | xxd -p | tr -d "[:space:]" | echo -n com.opick.app cat | sha256sum | tr -d "[:space:]-" | xxd -r -p | base64 | cut -c1-11

J'ai lu le document, ils disent que vous devez ajouter un path pour le release keystore dans la commande ci-dessus.pour moi, je ne fonctionne pas, veuillez mettre à jour le même

Le défi principal est que la clé générée est différente sur cmd et bash


15 commentaires

Quels sont les problèmes auxquels vous faites face?


@RishavKumar votre solution donnant une exception de délai d'expiration sur `SmsRetriever.addSmsListener ((event) => {console.log ('registere‌ dOtp' +" "+ event.message);}`


J'étais en train d'attendre pour cela. Votre code de hachage est incorrect. Veuillez essayer de récupérer le code hexadécimal correct. C'est différent pour les versions de débogage et de production. J'ai fait face à cela. :)


J'ai mis à jour ma réponse, s'il vous plaît voir. github.com/Bruno-Furtado/react-native-sms-retriever/issues/4


@RishavKumar comment obtenir la clé de hachage pour la version 1 où exécuter ces commandes que j'exécute dans java/bin pour la publication ce que vous devez faire pouvez-vous montrer un exemple pour la publication


Suivez simplement le lien ci-dessus, il a toutes vos réponses


la solution est uniquement pour la clé de hachage de débogage et pour la version comment ajouter le chemin du keystore de libération


pour la publication, vous devez avoir le chemin de votre fichier de clés de production


@RishavKumar lorsque j'ajoute un chemin, la commande n'exécute pas le chemin du fichier est E:\ReactNative\opick\android\app\my-key.keystore


que diriez-vous de donner un chemin relatif plutôt qu'un chemin absolu. Le chemin relatif serait: ./android\app\my-key.keystore


@RishavKumar quelque chose ne va pas car il ne demande pas de mot de passe comme dit ici stackoverflow.com/questions/7506392/...


Ce lien est pour le hachage de la clé Facebook


@RishavKumar j'ai essayé avec ceci et son fonctionnement npmjs.com/package/react-native-otp-verify


@RishavKumar la clé ajoutée dans les sms s'affichera toujours dans les sms ou on peut se cacher


Toujours tu ne peux pas te cacher


3 Réponses :


1
votes
import SmsRetriever from 'react-native-sms-retriever';

// Get the phone number (first gif)
 _onPhoneNumberPressed = async () => {
  try {
    const phoneNumber = await SmsRetriever.requestPhoneNumber();
  } catch (error) {
    console.log(JSON.stringify(error));
  }
 };

// Get the SMS message (second gif)
_onSmsListenerPressed = async () => {
  try {
    const registered = await SmsRetriever.startSmsRetriever();
    if (registered) {
      SmsRetriever.addSmsListener(event => {
        console.log(event.message);
        SmsRetriever.removeSmsListener();
      }); 
    }
  } catch (error) {
    console.log(JSON.stringify(error));
  }
};
For timeout error please see : https://github.com/Bruno-Furtado/react-native-sms-retriever/issues/4

6 commentaires

Utilisez cette bibliothèque. J'ai personnellement utilisé et obtenu les résultats


pour cette autorisation sms sera nécessaire?


Pouvons-nous télécharger une application sur le Play Store avec cela sans violer la politique d'autorisation de sms / journal


Non, c'est pourquoi c'est nécessaire. Aucune autorisation requise et le Play Store le permet, car cela utilise les API Google


Bien sûr, vous devez trouver la clé hexadécimale de production de votre application et l'envoyer par SMS


Continuons cette discussion en chat .



0
votes

J'ai essayé deux trois exemples mais je n'ai pas pu obtenir la hash key pour le debug annonce de release puis j'ai essayé la solution suivante Cela fonctionnait parfaitement. Vous pouvez également utiliser ce code pour obtenir la hash key et vous pouvez continuer votre implémentation

react-native-otp-verify

Le code suivant vous donnera la clé de hachage pour la version et le débogage de l'apk, récupérez simplement la clé et copiez-la quelque part pour l'utiliser

import RNOtpVerify from 'react-native-otp-verify';

getHash = () =>
   RNOtpVerify.getHash()
  .then(console.log)
  .catch(console.log);

startListeningForOtp = () =>
    RNOtpVerify.getOtp()
    .then(p => RNOtpVerify.addListener(this.otpHandler))
    .catch(p => console.log(p));

otpHandler = (message: string) => {
    const otp = /(\d{4})/g.exec(message)[1];
    this.setState({ otp });
    RNOtpVerify.removeListener();
    Keyboard.dismiss();
  }

 componentWillUnmount() {
   RNOtpVerify.removeListener();
 }


1 commentaires

Comment puis-je tester qu'il fonctionne. J'essaie d'envoyer le SMS au mobile à partir d'un autre mobile avec le format et le hachage exacts mais il ne détecte pas l'OTP.



0
votes

Il existe un excellent tutoriel d'article sur la façon d'implémenter la vérification automatique OTP dans React Native sans prendre l'autorisation.

Lien1

Mais pour cela, vous devrez générer la clé de hachage unique à 11 chiffres. Vous trouverez cela dans link2;

Lien2


0 commentaires