Social auth (Facebook and Google) in Flutter without Firebase
Traditional email and password logins do serve us their best, but in order to make user doesn’t feel like “Ohh dude! I should remember one more password, this hurts”, social login gives us easy way to login to any app. Let’s dive in to add this with our flutter app too!
Setup things and get started
Google auth
I am sorry to say this, but you do need to connect your app to Firebase in order to have your Google auth set-up.
Obviously we connect our app with firebase but we will not use the Firebase auth, but we will have our own auth server setup here. Checkout the first step of this article to connect your app with Firebase. You might not need to include the google-services.json file or enable any extra permissions in Firebase console as per the instructions from the google_signin plugin. You just need to connect the app to Firebase and that’s it.
One important thing to do before finishing Firebase connection, you need to select the support email from your project settings in firebase dashboard. You will get Permission denied error if you don’t do this.
Facebook auth
First you need to create an application there at Facebook developers website. Then pick your App id and App secret, we will use them shortly later on. Then setup your app there at the app’s Dashboard->Settings->Basic, the url might be similar to the below one, if you are unable to find it.
https://developers.facebook.com/apps/<app_id>/settings/basic/
Then setup the application as per your project credentials. To generate hashkey, refer to this link. Sometimes, the hashkey you have generated might not be the key used by facebook auth, please enter the key that will be shown there to you in the app’s dashboard. That’s all and you’re done.
Setting up the authentication part in Flutter
Let’s head over to the most interesting part. We will require couple of packages to dump in our application. You’ll find out them below.
Google signin plugin: https://pub.dev/packages/google_sign_in
Facebook signin plugin: https://pub.dev/packages/flutter_facebook_login
Please complete the additional steps required to be done, after you dump those plugins in pubspec.yaml
Implementation
For google auth, just copy the below snippet and you’ll have all the things required for authentication in your hands.
For facebook auth, just copy the below snippet and again you’ll have all the things required for authentication in your hands.
That’s all for this article, thank you for reading it, give a clap to the article, follow me at GitHub, Medium and connect me at LinkedIn for more exciting stuff.
