Connect Google Sign In with Firebase in Your Flutter App: Step-by-Step Guide

Google Authentication in flutter

Hey guys this is me, Aarthi Krishnan. In this blog i'm going to guide you with "How to connect google sign in flutter". I hope this will help you.

Let’s get started. In Flutter we already have a package called “google_sign_in” With the help of this package we gonna build Google Sign and also we need a Firebase project for this.

Firebase Integration:

Go to firebase.com then create a new project name called Google Signup or whatever you want.  Once the app is created then click iOS.

Firebase Ios Integration

In there go to “Authentication” and then click Google in there you can see so many platforms but we need google only. Now go ahead and click Google.

Firebase step guide

Once you click Google. It will ask for your display name in the project you can edit whatever name you want. Then below in the second text field box provide your support email and then hit the enable button 

Now go to project settings in there you will find google-Service-Info.plist file download that.

Download Firebase google-Service-info.plist file

Back to project folder:

In your flutter project directory inside the iOS folder -> open your Runner.xcworkspace file. Under Runner folder drag and drop your Google service info .plist file. That’s it

Go to your info.plist the file under the iOS folder and open it. In there copy and paste the below code:

<!-- Put this in your flutter project under [my_project]/ios/Runner/Info.plist file -->
<!-- Google Sign-in Section -->
<key>CFBundleURLTypes</key>
<array>
	<dict>
		<key>CFBundleTypeRole</key>
		<string>Editor</string>
		<key>CFBundleURLSchemes</key>
		<array>
			<!-- Change your REVERSED_CLIENT_ID with your copied id from GoogleService-Info.plist -->
			<string>*******Reversed client id*******</string>
		</array>
	</dict>
</array>

You can find your REVERSED_CLIENT_ID in your downloaded google-service-info.plist file, iOS integration is Done.

Let's come back to our flutter code. Now create Login button for google sign in flutter

Below are the function for our login and logout function. By the help of this function we gonna build google authentication.

Download GitHub Source Code

OutPut:

Google sign in with firebase flutter authentication

That's it guy i hope this will help you. Thank your spending time with me.

Happy Coding - Aarthi Krishnan