
At the end of this tutorial, you will be able to use google plus plugin in your ionic 4 application. We will use google plus Cordova plugin and firebase to use this feature in our app.
Installation
Install the Cordova plugin to your ionic 4 application
Step 1 – ionic Cordova plugin add Cordova-plugin-google plus
Step 2- npm install @ionic-native/google-plus
After installing the plugin to your ionic 4 apps, you should create a firebase account, and create an application. In the authentication, section enables Google sign in for your application.
Once enabled it will let you download the google-service.json
configuration file, you’ll store this file in your project’s root, right next to the package.json
file.
There are two certificates you’ll need, one for production and one for development, in this tutorial we’ll get the development certificate sign-in, and in the end, I’ll show you where to get the production one.
$ keytool -exportcert -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore
Enter the password and you will get the SHA 1 Key, please use this key in firebase. Else you will get the Error 10 while debugging.
For the production environment, you must generate the key and use the sha1 key in your firebase application to enable google sign in.
Download the google-services.json and put this file to the root folder of your application. Now its time to write some code.
Import GooglePlus module to app.module.ts
import { GooglePlus } from ‘@ionic-native/google-plus/ngx’;
constructor(
private GooglePlus: GooglePlus,
) {}
//For login
this.GooglePlus.login({})
.then((res:any) => {
You will get the response.
})
.catch((err) => console.error(err));
//For logout
this.GooglePlus
.trySilentLogin({
offline: false,
})
.then((res: any) => {
console.log(res);
this.google.logout().then(
(res: any) => {
console.log(res);
},
(err) => console.log(err)
);
});
Thank Note
First of all thank you for giving me your time and attention, if you’re experiencing any issues please comment.