Flutter Firebase Phone Auth Tutorial For Beginners | Firestore, Firebase Storage, Auth (Latest)

Подписаться 13 тыс.

Просмотров 78 тыс.

50% 1

Hello everyone, in this video we will be learning how to implement a phone authentication system in flutter and firebase. We will be using firebasefirestore, firebase storage, authentication.
Source Code:
/ 75827635
► Join Patreon
/ backslashflutter
Sign up for 10,000 free mins: bit.ly/3X32Jup
Find out more about ZEGOCLOUD: bit.ly/3AmrNmi
Guides to build chat app: bit.ly/3hQqAx2
► ALSO LEARN TO INTEGRATE GOOGLE and FACEBOOK SIGN IN TO YOUR APPS:
📗 Complete Google and Facebook Login In Flutter | Flutter & Firebase Authentication 2021 (Part 1)
• Complete Google and Fa...
📗 Facebook Login In Flutter | Flutter & Firebase Authentication For Beginners 2021 (Part 2)
• Facebook Login In Flut...
🔔 Get updated with my projects🔔
Follow me on Github: github.com/backslashflutter
#chewieplayer #fluttervideoplayer #backslashflutter

🔥 Subscribe for more:
/ backslashflutter
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
If this helps make sure to share it with friends and colleagues who will benefit from this
Have questions/queries? 💬 Comment below I will be happy to help
►For the 3D intro, I'm using Rotato: rotato.xyz
🎵Credits :
Music Used:
JARICO - LANDSCAPE • Video
softy x no one’s perfect - The Beauty Around Us ✨ [lofi hip hop/relaxing beats]
Reddit Username : @backslashflutter
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
🔗OTHER:
PLAYLIST:
1. FLUTTER AND FIREBASE
LINK :bit.ly/35Uq7Ba
2. FLUTTER SPEEDCODE
LINK: bit.ly/3sFDy1O
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
OTHER VIDEO:
Complete Flutter Installation & Setup Tutorial For App Development on MacOS (Latest)
• Complete Flutter Insta...
Learn API Integration in Flutter | Building A Dictionary App with OwlBot API | (Under 20 Minute)
• Learn API Integration ...
ChatBot App In Flutter | Python Backend With Flutter | Heroku Server (Full Explanation)
• ChatBot App In Flutter...
About Flutter:
Flutter is an open-source UI software development kit created by Google. It is used to develop cross platform applications for Android, iOS, Linux, Mac, Windows, Google Fuchsia, and the web from a single codebase. The first version of Flutter was known as codename "Sky" and ran on the Android operating system.
THANKS FOR LOVE AND SUPPORT💪

Опубликовано:

11 дек 2022

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 146

@backslashflutter Год назад

Other best method to setup default phone Country country = CountryParser.parseCountryCode('IN'); // IN is for indian phone number

@user-lk4ft3ms3m 8 месяцев назад

Phone authentication time Recapcha how can remove android & ios both.

@kenethnjoroge5313 11 месяцев назад

I will only say this... THIS IS PURE GOLD!!! THANKS MAN!

@oussamasbisiane4544 9 месяцев назад

thanks dude u really help me with that very simple code to understand and make my own changes

@prashantkhare Год назад

Thank you very much for making such a beautiful tutorial in a very easy way, May god bless you

@backslashflutter Год назад

Thank you so much 😀

@johnkim7321 Год назад

You're great! 😀It helps me a lot. Please upload more lectures.

@backslashflutter Год назад

thanks for watching

@techadot 8 месяцев назад

As of today, this video is valid. And for those getting errors, watch the video with patience, do not skip any path, follow all due process in the video. Thanks @backslashflutter💙, from Nigeria 🇳🇬

@sush.07 6 месяцев назад

thank you so must, you added value in my coding love from mumbai.

@mohammednawar9417 4 месяца назад

Thank you dear for an amazing tutorial

@user-gt4fl1zi6k 9 месяцев назад

thanks for your video man.

@aouadicharaf1038 7 месяцев назад

Subbed! ❤❤❤

@faissi21 4 месяца назад

you are the goat bro

@abrarlasebai405 Год назад

amazing content, BIG LIKE From Libya 👏👏 Best of Luck 🌸🌸

@backslashflutter Год назад

thanks for watching

@bobdaawid2218 Месяц назад

Thank you sir

@richard2845 8 месяцев назад

thanks. good video

@hans7714 6 месяцев назад

Thanks for sharing

@salmanfortutorials 5 месяцев назад

MASTERRR!!!!

@sgk_rise 11 месяцев назад

Thanks for the video, Could you make a video that tells all the vscode plugins you are using. I like the one where you collapsed the code within the brackets @ 1:17:42. thank you.

@indomiegoreng8782 Месяц назад

terimakasih pak!

@mochouinard Год назад

First, thanks alot for making this video, it was amazing for me to get started, I just finished watching it all, so here a few issues I found : 28:19 This cause multiple bugs. You should not set text = value. You only need an empty setState. This also mean you don't need the following code shown to move the cursor at this end. One of the code error I saw was you put the phoneNumber inside the uid somewhere (I don't recall where, I just didn't wrote it like this on my end). The rest might be me, since I rewrote all the code, you were quick and I might have missed a function. But I'm on Android, and visually it doesn't work well... I guess it need some way to adjust the visual it feel good to use when the keyboard show up. I got it to work with the fake SMS number, but if I use a different SMS number, the app stop in debug mode somewhere. Also, when you enter the wrong OTP code, I need to rotate my phone (to trigger the setState()) so it bring me back. I'm don't fully understand how you implement authentication... Once a user is signed in, there is no authentification being made to firebase ? It seem to just read a local variable in the checkSign() Shouldn't it check the Firebase backend to see if it true or not ?.

@backslashflutter Год назад

whooooo, seems like you encountered lot of bugs. I am sorry for this. Let's connect over gmail if you still face this issue backslash.flutter@gmail.com

@juliokavege9772 Год назад

Thank for this greatest content. Can please also show as how to automaticaly retreive sms code on the otp screen?

@drmsa1982 Год назад

28:40 just keep the setState empty and it will update the icon without reversing the numbers onChanged: (value) { setState(( ) { }) ; }, and no need for additional code. Thanks for your video.

@backslashflutter Год назад

thanks

@hrithikreddy-upgradhooman87 11 месяцев назад

Hey Hi I really liked the tutorial but found few bugs when i started to trail the 2nd user to login at: 1:55:26 I have put the code exactly as you taught but it says firebase_storage/unknown and its not allowing me to store the user data. Could you please help me out with this it would be a great help.... Thank You

@codingmafia1642 5 месяцев назад

Perfect , can you assist ho do I prevent double sign-in in different devices using same number

@amolharsh7375 Год назад

Hello Backslash Flutter, I have subscribed your channel and actively watch your videos. Thanks for creating these wonderful and informative contents. I have a query. At timestamp 1:08:52 , why are you changing the settings in the App Check thing? I was not able to understand. Why is it necessary to do that? Thanks

@backslashflutter Год назад

this is there to enable the firebase integration for phone auth and other monitoring for billing and spam frauds. I saw that phone auth's recaptcha bypass was done through this so integrated this

@philosophia5577 10 месяцев назад

Great video buddy but work on Audio Quality.

@mazenal-ali765 Год назад

thank you very much for such a creative and useful content. There is a big problem with this approach that I couldn't solve, when a user enters phone number and verify the OTP he will be redirected to the registration screen to fill the information, if anything interrupt this process and user didn't complete the rest of the information next time when the user opens the app it will redirect to the home screen and all info will show as null. how can prompt the user to enter the missing information incase he didn't complete them?

@backslashflutter Год назад

you mean the otp verification is completed and user is there on information page. What you can do is to store a new key in shared preference for isSignedIn which is alreay present i guess and only save that isSignedIn to true once information is filled and save is clicked.

@montadheralzubydi1634 23 дня назад

great work , i have the error null check operator used on a null value ,i tried for days to solve it but nothing work , can you please get me an answer

@seetheworld3839 9 месяцев назад

hey buddy what to do so that i dont go to that captcha screen as it isnt a good user experience

@msmsmsms1237 Год назад

Thanks its grait video, it works on android but not on ios, when I run pod install it gets shared pref foundation NOT ios

@KaranPalav 7 часов назад

But from windows native setup not possible for ios have to go with flutter app right ?

@MR_Football_001 11 месяцев назад

when i click continue : No App Check token for request. any help please ?

@anillimbu7092 11 месяцев назад

Hello thanks for the video but I ma getting a problem when I click the continue button in user_information_screen.dart it says User ID is not initialized!, what is wrong with my code anyone please help me.

@collinsmutai613 Год назад

thanks for the great video, just have an issue my country code picker on android initially is blank but after starting to input a phone number it displays(only displays country code and flag when field is active)

@backslashflutter Год назад

please check the pinned comment there is way out

@Sheikh_Sakibul_Islam Год назад

to add dependency just click "f1" then search "add dependency" then paste the name , simple

@backslashflutter Год назад

ok thank you

@snopcatdeveloper653 Год назад

please make video on resend otp with timer and custom errors handling

@backslashflutter Год назад

sure

@abhijitnag8161 Год назад

play integrety api that error is not being resolved please help how to solve it. again and again it is showing an error occurred while accepting terms and conditions similar to your video. Please solve this.

@user-ub8yw9oz3u 10 месяцев назад

Hey i want to store a number which doesn't conten country code How to do that? I am using firebase firestore I am using otp authentication

@arshiajs Год назад

tnx to your great video, 1 issue: in "userinformationscreen" , userModel: userModel gets an error, How to fix it ?

@backslashflutter Год назад

can you please share more detail. If you want please go through the github repo and check the source code there> github.com/backslashfluttter

@afrikanking4022 Год назад

On Android the otp comes as expired. My man you did really well making this video. please help us complete. Android is not working

@backslashflutter Год назад

ya mate i know android is causing isssue with captcha but the expired otp is not the case. PLease check the code from github if issue still exists. github.com/backslashflutter

@sakshamavasthi1013 9 месяцев назад

which repository provide the exact link please

@user-sj4zx7ur2h Год назад

how to make the change to fill auto OTP in this verification page ?

@genelizleyici6739 10 месяцев назад

When I restart the app my userModel variable in the provider doesnt't work proparly. I can't use the data from firebase. Can anyone help me please?

@user-ub8yw9oz3u 10 месяцев назад

Hey i want to store a number which doesn't conten country code How to do that?

@PankajSinghR Год назад

Thanks now seting default flag problem solved 😃,

@backslashflutter Год назад

thanks for watching bro

@backslashflutter Год назад

there are other method also like: Country country = CountryParser.parseCountryCode('IN'); // IN is for indian phone number

@TrencTolize Год назад

I've been following several different tutorials on setting up Firebase now and they all show that it should be working in this way. However, for me it always throws the error "FirebaseOptions cannot be null when creating the default app." I've tried it on Windows and on Mac and it's always the same error. InitializeApp() seems to not work anymore without specifying the options parameter, or it's just me.

@backslashflutter Год назад

hahaha mate, i have been using it for long time rather without this no one can integrate the firebase. please check the steps like google-service.json file and other things if you have implemented that.

@sukooon Год назад

Can you please make a video on forget password and reset password through an email link

@backslashflutter Год назад

sure bro

@fatihmerickoc Год назад

how can i make sure that when a user opens the app it shows the main screen instead of the get started screen??

@backslashflutter Год назад

you can play with shared perference library to implement this thing. Store a key let's say isOnboardingDone, and then use that key to determine the navigation.

@sadanandasherigara3309 Год назад

I want join as patreon member. I don't know how you downloaded iOS simulator and open it with vscode.

@backslashflutter Год назад

you can become part of patreon community here; www.patreon.com/backslashflutter

@angelconsolalopez4254 Год назад

Hi, I can't get the SHA-1 cetificate, keystore not found, what can I do? Could I connect the project to flutter firebase instead of android?

@backslashflutter Год назад

yes there is a very detailed video on my channel regarding that, please have a look at it

@henoktesfaye7130 7 месяцев назад

where is the link to the image resource?

@nwaekwuchukwuebukajohnpaul8798 Год назад

After adding country picker pub dev How was the country class created

@backslashflutter Год назад

I mentioned it in pin comment mate Country country = CountryParser.parseCountryCode('IN');

@acornerofherheart-jr9pl 10 дней назад

can i sue firebaseAuth to send sms for forget password verification otp to the user's mobile number?

@kumsakitessaofficial3721 Год назад

please no app check option in my firebase under project setting, so can you help me please

@backslashflutter Год назад

this is the issue which most people are facing mate. when i find way out then will definitely let you know

@arunsharma4792 Год назад

yes the same error is coming at my end in app check please tell how to resolve it

@backslashflutter Год назад

what error mate?

@joshyabraham670 Год назад

Hi I have mailed a specific problem about storage and the link to the git repository.Please have a look and give suggestions, if any.

@backslashflutter Год назад

sir, i am really occupied with lot of things, will suggest to battle this for a while.

@joshyabraham670 Год назад

@@backslashflutter solved the issue.. thanks

@secrescence Год назад

are you using m1/m2 macbook?

@backslashflutter Год назад

m1 mac air 2020

@berkanyukselgun5496 10 месяцев назад

I can't continue after 1:09:00. Play integrity does not approve. Is there a video on how to fix this? How can I verify sms for an application that is not installed in the play store?

@sadeemkhalid4219 4 месяца назад

did you solve it? i am facing the same problem

@amolharsh7375 Год назад

Please upload how to remove captcha from ios, soon!

@backslashflutter Год назад

sure

@factGraphic Год назад

After safetynet how we can remove captcha it is the reason for loses many user from our app how we can remove recaptcha verification ill tried play integrity api but i can't

@backslashflutter Год назад

Most people are waiting for some solution from google for this, on IOS i know this can. be easily done with APNs configuration setup on firebase and ios device. I am able to integrate that on ios, but for android i am still waiting for some solution, will let you know if i have any.

@zubairahmad7307 9 месяцев назад

I am getting error on this line await Firebase.initializeApp(); Exception has occurred. PlatformException (PlatformException(null-error, Host platform returned null value for non-null return value., null, null)) how I correct?

@syedquadri3922 8 месяцев назад

Hi. Try adding this dependency. Use this package as a library Depend on it Run this command: With Flutter: $ flutter pub add provider This will add a line like this to your package's pubspec.yaml (and run an implicit flutter pub get): dependencies: provider: ^6.1.1

@royale1223 Год назад

I think it's best not to touch phoneController and keep track of the length in another field.

@backslashflutter Год назад

you mean the onChanged field of textFormField right?

@royale1223 Год назад

Yup

@manishmaurya450 7 месяцев назад

hy i followed all but there is some issue its working fine in debug mode but in release apk otp is not coming pls help

@favourwilliams7319 6 месяцев назад

i got this same error where you able to fix it??

@siddharthasrivastava Год назад

Can I use getX with Provider and will it cause any issue with the performance and stability?

@backslashflutter Год назад

bro will suggest not to use getx

@nagamadhugandebathula3363 Год назад

will this work on windows vscode?, please let me know

@afrikanking4022 Год назад

Yes I followed this video on Windows VScode and it worked well

@backslashflutter Год назад

thanks for replying and helping the community @afrikanking4022

@ahmedfayez3821 Год назад

hello , we need the sourse code pro

@backslashflutter Год назад

github.com/backslashflutter

@NikeshMadhav Год назад

Hi can you add sms autofill feature into it as well

@backslashflutter Год назад

Sure will add it

@ibrahimkhattab369 Год назад

@@backslashflutter Can you please add this one cuz I'm suffering with adding the autofill functionality to the app I'm working on

@unknownking139 Год назад

Please when you will add it ???

@user-ub8yw9oz3u 10 месяцев назад

Hey i want to store a number which doesn't conten country code How to do that? I am using firebase firestore I am using otp authentication

@ebenezerocansey2920 Год назад

Thanks for the video but there is one problem. If you log out and u want to log back in with the same number, an OTP is sent to you but when you enter the OTP it still asks you to put in your OTP. it does not take you to the HomePage as it should

@sheralikhtk5200 Год назад

same here.

@random_akki Год назад

hey did you get any solution for this?

@backslashflutter Год назад

can you all check the source code mate. github.com/backslashflutter

@user-ub8yw9oz3u 10 месяцев назад

@@random_akkiyes

@ansvelmarketplace6264 8 месяцев назад

@@backslashflutter, I just check the github repo and couldn't find the source code. Can you please help with the actual link to the repo? I also sent an email to you on this. Thank you so much.

@vacandboss6484 Год назад

Pls make dream 11 clone in flutter tutorial

@backslashflutter Год назад

will see this

@ashutoshkapoor5031 Год назад

1:09:43 it is showing that the safety net is deprecated now how to proceed now?

@backslashflutter Год назад

yes that is deprected by google. Still many developers face issue with it. All i can tell you is to enable the push notification functionality in your app and try to go through device check thing in firebase

@ashutoshkapoor5031 Год назад

@@backslashflutter okay sure And also I used otp_text_field for the OTP field but the verify button is showing "please enter the OTP" even after entering the OTP

@user-ub8yw9oz3u 10 месяцев назад

1:17:45

@aryangupta7990 2 месяца назад

HOW TO REMOVE CAPTCHA REDIRECT, PLEASE PROVIDE SOLUTION FOR THAT 🙏🙏🙏🙏🙏🙏

@AaryaZunjarrao 2 месяца назад

Hello I just want to ask is the app working properly.should I follow this video for 2 hours

@rajeshsanuria5656 Год назад

reversed client id is not show in google service file

@Akhi.yt45 Год назад

did you find it reversed client id if yes let me know please

@backslashflutter Год назад

it is visible in google service.plist file for ios, on android you don't need it as such.

@kraei9799 День назад

please share source code?

@user-ub8yw9oz3u 10 месяцев назад

My account automatically logout after few time

@johnkim7321 Год назад

1:35:00

@backslashflutter Год назад

@ebenezerocansey2920 Год назад

Can you please, from this video add a resend code for authentication. This should be in case the user did not receive the code

@backslashflutter Год назад

add a elevated button and assign resend as text to the child of that elevated button, and in the onpress just simply call the same verifyOtp thing that you were calling.

@Raaz02Choudhary Год назад

hindi me bhi bola kar bhai thoda achi tarh samjh aayega or thoda slow kara kar coding bahut tej chalte ho aap

@backslashflutter Год назад

would appreciate if you can understand english well if you want to strive in tech community. I myself don't know it very well but trying is the only way out.

@dzdevdev 8 месяцев назад

this video helped me a lot!! thank you very much, and i invite you to Islam

@amanatsingh2205 Год назад

Can you guide me what to do next I have completed Flutter Course From Udemy By Academind by Maximilian Schwarzmüller How to become better and better in app development

@backslashflutter Год назад

start with mastering one state management and then start with creating some app which has CRUD operation in firebase flutter and use the state management you used. Then subsequently start with API usage, model creation and lot more. Working on some course in flutter will let you know soon.

@amanatsingh2205 11 месяцев назад

@@backslashflutter thanks

@divyanshsingh9485 Год назад

@backslashflutter Год назад

@imsandeeparya.3180 Год назад

Android studio is much better than vs code

@ihxrxh Год назад

Give me 5 reasons yo

@backslashflutter Год назад

i will prefer visual studio code for flutter dev. I only use android studio if i need to add native functionality to android app that links with my flutter app. Else will suggest not to go there.

@afrikanking4022 Год назад

#backslash Flutter when I use a normal phone number, I get this error which reads The sms code has expired. Please re-send the verification code to try again

@backslashflutter Год назад

please check the source code mate!

@user-ub8yw9oz3u 10 месяцев назад

Hey i want to store a number which doesn't conten country code How to do that? I am using firebase firestore I am using otp authentication