Flutter Android, iOS login with Google, Facebook account using Firebase

I spent some time working on this.

 

Here I will just address some errors when I met.

It's pretty easy to embed Google login with Firebase. The most problematic thing is Facebook login.

 

Firstly you will need a facebook account, developer account.

Then go here: https://developers.facebook.com/docs/facebook-login/android

create an app, be alerted! In year 2022, you need to create an app for consumers only. 

if you create an app on facebook for commercial, facebook needs you to provide passport, id and some license, it will takes many days before you can develop anything.

 

Then you will have a  "app id", "facebook access token". 

Just follow the link above to do it. The main problem you will meet is that you can't make your facebook app live.

You need to provide ToC and Policy and other User Data Deletation URL.

Go here to generate some templates: https://www.termsfeed.com/blog/privacy-policy-url-facebook-app/#

Also, you will need to register the app with Firebase. In put the app id, app secret, and copy the callback URL from firebase. Paste the callback URL to the facebook's app.

 

If you have some problems like this:  

Solved HttpStatus 400, errorCode 100, subErrorCode 33, errorType GraphMethodException | FaceBook Aut

  

Go watch this video:

https://www.youtube.com/watch?v=2Q30HK0wJos

 

 

 

Be sure to make your app live like this, after you input all the things Facebook wants you do.

 

Don't forget to grant permissions to your app. It controls what kinda info you can get from users on Facebook.

 

I used 2 kinds of Facebook login methods with Flutter. Both works well.

This one "flutter_login_facebook" is lite and cool: https://pub.dev/packages/flutter_login_facebook#android

This one "flutter_facebook_auth" is big and full: https://pub.dev/packages/flutter_facebook_auth

They all work very well, but I prefer flutter_facebook_auth. Coz its doc is very informative. It tells you if you have Android 11 or up, you will need to add something in AndroidManualfest.xml

 

Let's see the login page.

 

then logout. login via facebook or go anonymous

 

 

when you login,

 

In firebase dashboard

 

people login with facebook or google

 

If they login via Facebook, they will have 1 unique UID forever, same as google account.

Go anonymous, people will have different account uid everytime.

 

This is pretty cool. After successfully logined in. You can see users in Firebase's dashboard.

 

There's another sad error i got. It's the chrome in my Android 11 simulator crashed everytime. So i have to install another browser "Chrome beta", and set it to be default.

When you login via Facebook like this, a browser will called. Then it works. 

Ironically "chrome beta" is more reliable than chrome on Android for this scenario.

Anyway, it works. Oh yeah!

Now it's time to get some sleep. :)