Flutter autofill otp for otp based authentication

today we are starting a new series of flutter videos where every week we will be sharing a package of the week these are flutter packages which we have found very useful and I'm sure if you know its usage you will also find it useful and helpful in building flutter apps so today's package of the week is Android SMS retri package in most of our flutter apps we need to implement mobile based authentication where we need to retrive OTP from user in a userfriendly way this package helps us to automatically retrive the OTP from Android device which then we can populate in OTP field and perform authentication without asking user to type the OTP manually so let's open Visual Studio and let's create a new flirter project let's name name eight package of the week okay our new project is ready so let's open it in Visual Studio and now let's open the package website Android SMS retrial so this is our package and we need to install this package so let's check out the installation command and the installation command is flutter Pub AD Android SMS retriver so let's copy this command and let's open the terminal in our visual Visual Studio editor and let's paste this command here and let's run it so if we go to our Pops me yml we will find that our package is added and now we can go ahead and connect uh our mobile phone because we want to test the SMS feature so we need to use a real device I will connect it to my Android phone and you can see my Android phone is connected and I will run this app on my Android phone okay so our app is running and the default feature of the app is the counter feature which we can see is working working properly and now we will go ahead and download this repository we will unzip this repository and I will replace it with the current lab [Music] directory not exactly the LI directory of the package but the LI directory of the example and now I will refresh my app in case there is a error then I will have to restart the app but uh I think the app restarted automatically and here I can see that all the features provideed Ed by this package are listed here so I will directly go to the the feature that uh we need most for authenticating the user and this this is request onetime SMS consent so let's check out this feature so what I will do is that I will send a sample SMS message from my another device and this message is a simple message which says OTP and there there is a dash and then there is a OTP number so first I will tap on request one time SMS consent and here you can see that the status changed to waiting for consent and now I will send the OTP and let's see what happens so once this uh uh waiting for SMS uh status is there then your app is starts listening to the incoming SMS and uh once the first SMS arrives then it reads the SMS and here you can see that it's saying allow package of the week to read the message below and enter the code so I will tap on allow and once I tap on allow you can see that it has automatically read the OTP from my SMS and you can see it has print uh displayed it on the status uh status text so this is the app and this app sorry this is the package and this package is very much helpful in authenticating the user and making the process user friendly I hope you found this video informative stay tuned for for more such videos we will be uh we will be doing more videos based on package of the week and we'll be uh sharing more useful packages with our viewers thank you so much for watching this video bye-bye and have a nice day

Channel: Free Web & Mobile Apps

Views: 1,799

Keywords: autofill otp, flutter otp login, flutter otp authentication, flutter sms login

Id: DSK4xA8741k

Length: 8min 21sec (501 seconds)

Published: Sun Dec 17 2023