JSPM

  • Created
  • Published
  • Downloads 18827
  • Score
    100M100P100Q162114F
  • License MIT

Google Auth plugin for capacitor.

Package Exports

  • @codetrix-studio/capacitor-google-auth

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@codetrix-studio/capacitor-google-auth) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

CapacitorGoogleAuth

Capacitor plugin for Google Auth.

Install

1. Install package

npm i --save @codetrix-studio/capacitor-google-auth

# or for Capacitor 2.x.x
npm i --save @codetrix-studio/capacitor-google-auth@2.1.3

2. Update capacitor deps

npx cap update

3. Migrate from 2 to 3 version

if your migrate from Capacitor 2 to Capacitor 3 see instruction for migrate plugin to new version

Usage

for capacitor 2.x.x use instruction

WEB

Add clientId meta tag to head.

<meta name="google-signin-client_id" content="{your client id here}">

Register plugin and manually initialize

import { GoogleAuth } from '@codetrix-studio/capacitor-google-auth';

GoogleAuth.init()

Use it

GoogleAuth.signIn()

AngularFire2

async googleSignIn() {
  let googleUser = await Plugins.GoogleAuth.signIn();
  const credential = auth.GoogleAuthProvider.credential(googleUser.authentication.idToken);
  return this.afAuth.auth.signInAndRetrieveDataWithCredential(credential);
}

Vue 3

// App.vue
import { defineComponent, onMounted } from 'vue'
import { GoogleAuth } from '@codetrix-studio/capacitor-google-auth'

export default defineComponent({
  setup() {
    onMounted(() => {
      GoogleAuth.init()
    })
    
    const logIn = async () => {
      const response = await GoogleAuth.signIn()
      console.log(response)
    }
    
    return {
      logIn
    }
  }
})

iOS

Make sure you have GoogleService-Info.plist with CLIENT_ID

Add REVERSED_CLIENT_ID as url scheme to Info.plist

Android

Inside your strings.xml

<resources>
  <string name="server_client_id">Your Web Client Key</string>
</resources>

Import package inside your MainActivity

import com.codetrixstudio.capacitor.GoogleAuth.GoogleAuth;

Register plugin inside your MainActivity.onCreate

this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
  add(GoogleAuth.class);
}});

Configure

Provide configuration in root capacitor.config.json

{
  "plugins": {
    "GoogleAuth": {
      "scopes": ["profile", "email"],
      "serverClientId": "xxxxxx-xxxxxxxxxxxxxxxxxx.apps.googleusercontent.com",
      "forceCodeForRefreshToken" : true
    }
  }
}

Note : forceCodeForRefreshToken force user to select email address to regenerate AuthCode used to get a valid refreshtoken (work on iOS and Android) (This is used for offline access and serverside handling)

Migration guide

Migrate from 2 to 3

After migrate to Capcitor 3 updating you projects, see diff:

WEB
- import "@codetrix-studio/capacitor-google-auth";
- import { Plugins } from '@capacitor/core';
+ import { GoogleAuth } from '@codetrix-studio/capacitor-google-auth';

- Plugins.GoogleAuth.signIn();
+ GoogleAuth.init()
+ GoogleAuth.signIn()