Skip to content

Latest commit

 

History

History
125 lines (63 loc) · 4.25 KB

File metadata and controls

125 lines (63 loc) · 4.25 KB

Signing in with Google using Flutter

After a lot of research I realized that the only way to log in to Google without using Firebase is through the packages provided by Google.
Using these packages we can make the user log in without saving their personal data, except the data we want to show , like email and username.

Flutter

Let's get started. First of all we have to create a new Flutter Project.
Choose the Flutter Application option.

Flutter

Insert the Name of the Project and the company name.
After that in the 'main.dart' remove all the code except the main and switch the (MyApp) to (MaterialApp).
Insert 'Title'.

Flutter

Create a new class to extend a 'StatefulWidget'.
Change return 'Container' to 'Scaffold' so we can use the features provided by the Scaffold Class.

Flutter

Enter in 'pubspec.yaml' , then go to google and search for google sign in package flutter or click this link: https://pub.dev/packages/google_sign_in, go to installing and add that command to 'pubspec dependecies'.

Flutter

Flutter

Click on "Packages get" as we made a change to the packages to update.

Flutter

Import the Google package to 'main.dart'.

Flutter

Create the 'GoogleSignIn' object, provide the scope profile and email to that object.

Flutter

You need to create a SignInAccount object.
Name that object 'user' to be used to see if he is signed in or signed out.

Inside the 'Scaffold' use the 'AppBar' to add a Title.

Flutter

In the 'body' create a method '_buildbody'.
Inside that method you need to add a 'ListTile' to display the information,then use a GoogleUserCircleAvatar to display the profile image.

Flutter

Make the title and subtitle show the 'Name' and 'Email' on the screen. Create a button to be pressed with the text 'Sign out'.

Flutter

Flutter

In short, if the user is not connected, a message appears saying "Not Signed in". If this user is already connected, his data is displayed and a button appears saying "Sign Out".

Now, create both _GetSignIn and _GetSignOut methods.
Use the method silently/ SignInSilently(); -> Used to Sign In the user without interaction.

Flutter

After the UI is completed we need to register the App in the Firebase.
Even if we don't need to use Firebase the App has to be registered there.

So go to: https://console.firebase.google.com/u/0/ In the Firebase console, add a new project and get the same package name from your app.

Flutter

You will need to get the SHA-1 so go to 'gradlew' and to the terminal and run the command- 'gradlew signinReport'.

Flutter

Flutter

Insert the SHA-1 in the Firebase space then, download the file and paste it inside the Android > app.

Follow the steps to add the Firebase SDK / Go to people API:

https://developers.google.com/people/v1/getting-started

Follow those 3 steps.

Flutter

After that go to credentials and click the user data option.
Click on the API and go for Android or IOS.
Name your app again, put the SHA-1 you got from 'gradlew' and the package name you can find in your 'AndroidManifest.xml'.

Flutter

Set up the consent screen, go to support email and select your email then click save.
Go to OAuth 2.0 Cliente IDs, select the Android option.

On your Manifest.xml add below the package name this line:

   <uses-permission android:name="android.permission.INTERNET"/>

Then just edit the button as you like and the Google login is fully functional.