2 min read

React Native Gelen SMSleri Uygulama Üzerinden Okumak

React Native Gelen SMSleri Uygulama Üzerinden Okumak

Android uygulamamızda kullanıcı için sms doğrulama, şifre yenileme doğrulaması için gönderilen sms mesajları ve bunun gibi bir çok sms  aksiyonunda kullanıcılarımıza gönderdiğimiz doğrulama kodunu girerken uygulama üzerindeyken gelen mesajdaki veriyi okuyarak uygulamaya anlık doğrulama kodunu gösterip kullanıcı için kolaylık sağlayabiliyoruz bunu yapmamıza olanak sağlayan kütüphanenin ismi react-native-otp-verify  

react-native-otp-verify kütüphanesini react native uygulamanıza aşağıdaki şekilde kurabilirsiniz.

npm install react-native-otp-verify --save 

yada 

yarn add react-native-otp-verify

Kurulumumuzu yaptıktan sonra ilgili sayfamıza aşağıdaki kodları yerleştiriyoruz ve componentDidMount() methoduna getHash(); startListeningForOtp(); methodlarımızı koyup dinlemeyi açıyoruz

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) => {    const otp = /(\d{5})/g.exec(message)[1];    console.log(otp);    this.setState({ otp });  }  componentDidMount(){    this.getHash();    this.startListeningForOtp();  }  componentWillUnmount() {    RNOtpVerify.removeListener();  }

/(\d{5})/g.exec(message)[1]; buradaki 5 sayısı mesajdaki kodun kaç basamaklı olduğunu bildirmek için

yukarıdaki kodu uygulamanıza geçirdiyseniz sıradaki işleme geçelim aslında yapılması gereken bu kadardı bundan sonra uygulama üzerinde çalışıp çalışmadığını kontrol edeceğiz.

Uygulamayı kontrol etmenin en kolay yolu emülatör üzerinden fake sms attırmak o yüzden ben fake sms attıracağım.

uygulama doğrulama ekranımız bu şekilde olacak emülatörün menüsünde sağ alt 3 noktaya tıklayarak phone sekmesine geçiyoruz.

 

İşte buradaki kod bizim için cok önemli bu kodu bi yere yazın saklayın birşey yapın :)

Mesaj bölümümüze kopyaladığımız kodu en altta olacak şekilde yazıyoruz ve fake smsimizi gönderiyoruz. ve tebrikler uygulamanızda belirlediğiniz yere 14345 kodu gelmiş olması gerek burada en önemli yerlerden birisi doğrulama kodunuzun uzunluğu ile kodda girdiğimiz /(\d{5})/g.exec(message)[1]; alanındaki 5 sayısı ile aynı olması gerek tüm bunları yaptıktan sonra size  önerim birde bu kod alanını try catch bloğuna alalımki uygulamamız herhangi bir hata yüzünden uygulama kapanmasın.

bu şekilde tüm adımları yaptığınızda kütüphaneyi sorunsuz olarak kullanabilirsiniz umarım yadrımcı olabilmişimdir iyi çalışmalar dilerim