Add Google login to the Ionic app via Firebase

Submitted by francesco on Wed, 10/28/2020 - 19:39

To avoid to manage an authentication process, I leverage the Identity Service Providers handled by Firebase.
This article on medium explains how to do the initial setup for Google Login.

This will work, on your DEV environment, but it will fail after the app is uploaded to the Play Store (you will see a message simply mentioning "Error 10").
The error comes from the Certificate Fingerprint used in the "ID Client OAuth" credential in the Google Cloud console.

Actually the Play Store signs all the apps that are uploaded, using a certificate they generate (i.e. not the one you use to build your app):
playstore signature image

In order for the Google login to work, you have to set this key in the credentials you use for the Google Login via the Google Cloud console:
credentials google cloud

The fingerprint also has to be set in the Firebase settings for the Android app:
firebase-android-settings

Another thing to consider for the Android applications is that Ionic basically runs on a local server on mobile devices.
Now, after you retrieve the credential details via the Google Cloud API key you created for Android, you run the function signInWithCredential to complete the authentication workflow via Firebase.
This functions uses the Google Could AIP key created for Browser.
In order for the process to work, it is important that "localhost" is an authorized referrer for this key.
referrer

 

Finally, don't forget to check the OAuth 2.0 cliend IDs for Google Cloud credentials are correctly set in config.xlm:
config.xml

And package.json:
package.json