Google Sign in using Flutter and Firebase

If you are making an app for Android and want to provide users with an easy way to sign up for the app Google Sign in using Flutter and Firebase, then your first choice would be Google Sign in. The other main reason can be to block spammy logins.
Well, with Firebase, it is a lot easier to integrate Google login into your Flutter app.

Pre Requisites Google Sign

1. Flutter App
2. Firebase link to your Flutter App

Step-by-Step Implementation

Most of the configuration is already done when using Firebase with Flutter. We only
need to configure our machine’s SHA key for Android use.

What is SHA Key, and Why do we need to link it

SHA (Secure Hash Algorithm) Key is a unique identifier that is like a digital fingerprint generated for our app. It ensures the authenticity and integrity of our app. Platforms like Google Google Play Store use it to verify that the app you’re uploading is actually from you and hasn’t been tampered with with flutterforums.

You need to keep your SHA key secret for security purposes and avoid sharing it with third parties that are not trusted. You can generate multiple SHA keys for app environments ( development, staging, and production). Make sure the correct key is linked to the proper environment.

Steps to Generate SHA key for your App using Keytool

Open the terminal and run the key tool utility to generate the certificate’s SHA fingerprint. You should get fingerprints for both debugging and releasing certificates. To get the release certificate fingerprint, run

keytool -list -v \
-alias <your-key-name> -keystore <path-to-production-keystore>
To get a debug certificate for Mac, run

keytool -list -v \
-alias androiddebugkey -keystore ~/.android/debug.keystore
For Windows, run.
keytool -list -v \
-alias androiddebugkey -keystore %USERPROFILE%\.android\debug.keystore
The default password for the debug key is Android.
The example output will be like:
Certificate fingerprint: SHA1:
DA:39:A3:EE:5E:6B:4B:0D:32:55:BF:EF:95:60:18:90:AF:D8:07:09

Package Installation in Google Sign in using Flutter and Firebase

From the root of your project, run the following command to install firebase_auth andgoogle_sign_in flutter pub add firebase_auth google_sign_in

This code defines an asynchronous signInWithGoogle function that allows users to sign in with their Google account. It:

1. Triggers Google sign-in and gets user information.
2. Creates a credential object based on the received information.
3. Uses the credential to sign the user into the app using Firebase
   Authentication.

Now, let’s call this function when clicking the button. We will use a simple Text Button to call the above function on a pressed event.

Future<UserCredential> signInWithGoogle() async {
// Trigger the authentication flow
final GoogleSignInAccount? googleUser = await GoogleSignIn().signIn();
// Obtain the auth details from the request
final GoogleSignInAuthentication? googleAuth = await googleUser?.authentication;
// Create a new credential
final credential = GoogleAuthProvider.credential(
accessToken: googleAuth?.accessToken,
idToken: googleAuth?.idToken,
);
// Once signed in, return the UserCredential
return await FirebaseAuth.instance.signInWithCredential(credential);
}

TextButton(
onPressed: signInWithApple,
child: const Text('Sign In With Google),
),

Excellent. We are almost done with our login process.

Enabling Google Sign-in in Firbease and Adding SHA Now, let’s enable Google sign-in in Firebase so we can authenticate our app.

1. Go to https://console.firebase.google.com/project/<project-name>/authentication
2. Click on Google under additional providers.

1. Enable it

Once that is done, let’s add the SHA key in the Firebase console.

• Go to project settings by clicking the setting icon.

• Now, select the Android app from the left panel, and below that, click on Add fingerprint and paste the above-generated fingerprint there.

And Congratulations, you have successfully implemented Google sign-in with flutter app.

Conclusion

This post taught us how to integrate Google Sign-In into your Flutter application. This convenient and secure approach streamlines user registration and enhances the login experience. Integrating Google Sign-In with Firebase Authentication can attract a broader user base and simplify onboarding. Happy coding!