Connexion Google sur Android

Prêt à copier un prompt de configuration avec les étapes d'installation et le guide Markdown complet pour ce plugin.

Introduction

In this guide, you will learn how to setup Google Login with Capgo Social Login for Android. I assume that you have already read the Guide de configuration générale.

In cette partie, vous apprendrez à configurer l'authentification Google sur Android.

Le certificat SHA1 Android est vraiment fastidieux et je ne voudrais pas que cela tombe sur quelqu'un. Les étapes suivantes supposent le scénario le plus simple d'une application qui n'est pas publiée sur Google Play Store et qui n'est utilisée que par le simulateur local ou le matériel de développement.

Si vous avez déployé votre application sur Google Play Store, vous DEVEZ ajouter un ID client Android supplémentaire contenant le SHA1 du console Google Play pour les versions de production. Vous pouvez trouver l'empreinte SHA1 utilisée par Google Play pour signer votre bundle de sortie sous Test and release > Setup > App Signing.

Enfin, il est important de mentionner que si vous faites une erreur, l'erreur ne sera PAS évidente. Il peut être très difficile de déboguer. Si vous avez des difficultés avec la configuration, veuillez consulter les Github problèmes.

De plus, vous pouvez consulter la section de dépannage de la Configuration de l'authentification Google pour Android pour plus d'informations.

Créer un identifiant de client Android.
1. Cliquez sur la barre de recherche
2. Recherchez pour credentials et cliquez sur le APIs and Services un (le numéro 2 sur l'écran d'écran)
3. Cliquez sur le create credentials
4. Choisissez OAuth client ID
5. Choisissez le Android Type d'application
6. Ouvrez Android Studio
7. À la base de la barre de navigation, trouvez la Gradle Scripts
8. Trouvez build.gradle pour le module app
9. Copiez le android.defaultConfig.applicationIdCela sera votre package name dans le console Google
10. Ouvrez maintenant le terminal. Assurez-vous d'être dans le android dossier de votre application et exécutez ./gradlew signInReport
1. Faites défiler vers le haut de cette commande. Vous devriez voir les éléments suivants. Copiez le SHA1.
1. Retournez maintenant dans la Console Google. Entrez votre applicationId comme le Package Name et votre SHA1 dans le champ de certificat et cliquez sur create
Créez un client web (c'est obligatoire pour Android)
1. Allez sur la Create credentials page dans le Console Google
2. Fixez le type d'application sur Web
3. Cliquez sur Create
4. Copiez l'ID client, vous en aurez besoin comme le webClientId dans votre JS/TS code

Modifier votre MainActivity

Ouvrez votre application dans Android Studio. Vous pouvez exécuter cap open android
Trouvez MainActivity.java
1. Ouvrez le app dossier
2. Trouvez java
3. Trouvez votre MainActivity.java et cliquez dessus

Modifiez MainActivity.javaVeuillez ajouter le suivant code

import ee.forgr.capacitor.social.login.GoogleProvider;
import ee.forgr.capacitor.social.login.SocialLoginPlugin;
import ee.forgr.capacitor.social.login.ModifiedMainActivityForSocialLoginPlugin;
import com.getcapacitor.PluginHandle;
import com.getcapacitor.Plugin;
import android.content.Intent;
import android.util.Log;
import com.getcapacitor.BridgeActivity;

// ModifiedMainActivityForSocialLoginPlugin is VERY VERY important !!!!!!
public class MainActivity extends BridgeActivity implements ModifiedMainActivityForSocialLoginPlugin {

      @Override
      public void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);

        if (requestCode >= GoogleProvider.REQUEST_AUTHORIZE_GOOGLE_MIN && requestCode < GoogleProvider.REQUEST_AUTHORIZE_GOOGLE_MAX) {
          PluginHandle pluginHandle = getBridge().getPlugin("SocialLogin");
          if (pluginHandle == null) {
            Log.i("Google Activity Result", "SocialLogin login handle is null");
            return;
          }
          Plugin plugin = pluginHandle.getInstance();
          if (!(plugin instanceof SocialLoginPlugin)) {
            Log.i("Google Activity Result", "SocialLogin plugin instance is not SocialLoginPlugin");
            return;
          }
          ((SocialLoginPlugin) plugin).handleGoogleLoginIntent(requestCode, data);
        }
      }

      // This function will never be called, leave it empty
      @Override
      public void IHaveModifiedTheMainActivityForTheUseWithSocialLoginPlugin() {}
}

Enregistrez le fichier

Use Google Login in your application
1. Tout d'abord, importez SocialLogin
```
import { SocialLogin } from '@capgo/capacitor-social-login';
```
2. Appeler l'initialisation. Il convient de l'appeler qu'une seule fois.
```
// onMounted is Vue specific
// webClientId is the client ID you got in the web client creation step not the android client ID.
onMounted(() => {
  SocialLogin.initialize({
    google: {
      webClientId: '673324426943-avl4v9ubdas7a0u7igf7in03pdj1dkmg.apps.googleusercontent.com',
    }
  })
})
```
3. Appeler SocialLogin.loginCréez un bouton et exécutez le code suivant code lors du clic.
```
const res = await SocialLogin.login({
  provider: 'google',
  options: {}
})
// handle the response
console.log(JSON.stringify(res))
```
  Si vous initialisez Google avec mode: 'offline', SocialLogin.login() retourne serverAuthCode pour votre flux d'échange backend. N'appellez pas SocialLogin.refresh({ provider: 'google' }) dans l'application dans ce mode. Échangez serverAuthCode sur votre backend, stockez le jeton de rafraîchissement Google là-bas, et rafraîchissez sur le backend.
Configurez l'émulateur pour les tests
1. Allez dans Device manager et cliquez sur le bouton plus
2. Créez un appareil virtuel
3. Sélectionnez n'importe quel appareil avec un Play Store icône
  
  Comme vous pouvez le voir, le pixel 8 Supporte par Play Store services
4. Cliquez next
5. Assurez-vous que l'image d'OS est de type Google Play. Il faut de type Google Play
6. Click next
7. Vérifiez votre appareil. Vous pouvez nommer votre émulateur comme vous le souhaitez
8. Allez dans Device Manager et démarrez votre simulateur
9. Après le démarrage du simulateur, allez dans ses paramètres
10. Allez dans Google Play
1. Cliquez Update et attendez environ 60 secondes
Testez votre application

Si vous avez fait tout correctement, vous devriez voir le flux de connexion Google fonctionner correctement :

Troubleshooting

Si vous rencontrez des problèmes, comparez d'abord vos paramètres d'application avec les valeurs du Cloud Console Google. Les échecs de connexion Google Sign-In sur Android sont généralement causés par une incohérence entre le nom de package, la valeur SHA-1 ou l'ID client.

Gestion des jetons, SHA-1 et Firebase

Sur Android, ce plugin utilise le Gestionnaire de Clés Google.androidx.credentials et Connectez-vous avec Google), pas la version legacy GoogleSignInClient API. Erreurs de logcat telles que GetCredentialCustomException: [28444] Developer console is not set up correctly Gestion des jetons, SHA-1 et Firebase

Filtrer Logcat avec GoogleProvider ou CapgoSocialLogin Après un échec de connexion. Le plugin enregistre votre nom de package, SHA-1 de signature et un masqué webClientId Vous pouvez les comparer avec le console Google Cloud.

Configuration requise Google Cloud

Vous avez besoin de deux types d'identifiants OAuth 2.0 dans le même projet Google Cloud :

Type de client	Utilisé pour	Où cela va
Application web	Serveur / audience d'ID de jeton	`webClientId` en `SocialLogin.initialize()`
sur Android, un par clé de signature	Vérifiez que votre APK est autorisé à appeler Google	seul disponible dans le Google Cloud Console. N'envoyez pas cet ID à `webClientId`

Une erreur fréquente est d'utiliser l'ID du client Android comme webClientIdLe gestionnaire de credenciaux nécessite l'ID client Web là. Le client Android n'a besoin que du nom de package correct et de la SHA-1 enregistrés dans le console.

Créez un client OAuth Android pour chaque certificat qui signe les builds que vous testez :

Débogage : depuis ./gradlew signingReport pour la variante de débogage.
Lancement : à partir de l'APK ou de l'AAB que vous installez réellement.
Play App Signing : à partir du console de Play > Intégrité de l'application > Clé de signature de l'application. Cela est requis pour les builds de magasin Play même si votre SHA-1 de clé d'upload est déjà enregistré.

Le applicationId in android/app/build.gradle doit exactement correspondre au nom de package Android OAuth, y compris tout suffixe. .debug suffix.

If the OAuth consent screen is in Testing mode, add every Google account you test with under Audience > Test users. Publishing the app to Production is not required for email et profile scopes. Liens d'actifs numériques (assetlinks.json) ne sont pas requis pour le connexion avec Google via Gestionnaire de credenciaux.

Les modifications de Cloud Google peuvent prendre jusqu'à quelques heures pour se propager.

Erreur 28444 : Le console de développeur n'est pas configuré correctement

Cela signifie généralement que Google a rejeté la combinaison du certificat de signature APK installé, du nom de package et de webClientIdTravaillez à travers ce checklist :

Confirmer webClientId est l'ID du client de l'application Web et se termine par .apps.googleusercontent.com.
Démarrez l'application, reproduisez l'erreur et lisez Logcat pour GoogleProvider, signingSha1=, et package=.
Dans Google Cloud Console > Identifiants, ouvrez votre client OAuth Android et vérifiez le nom de package exact et la valeur SHA-1.
Si vous testez une version de production, enregistrez la clé SHA-1 de cette version, et non seulement le keystore de débogage.
Si l'application est distribuée via Google Play Store, enregistrez également la valeur SHA-1 de l'application de signature Play.
Assurez-vous que les clients Web et Android soient dans le même projet Google Cloud.
Si l'écran de consentement est en mode Test, confirmez que l'utilisateur Google est un utilisateur de test.
Wait and retry after console changes.

USER_CANCELLED after picking an account on a misconfigured debug build can still be a SHA-1 or client ID mismatch. Fix the console setup above first.

Extrayez la SHA-1 de l'installation de la build

Mises en œuvre de débogage ou locales :

cd android && ./gradlew signingReport

APK de version finale :

keytool -printcert -jarfile android/app/release/app-release.apk

Ajoutez cette SHA-1 à un client OAuth Android avec le nom de package correspondant, réinstallez la même APK signée et testez à nouveau :

adb install android/app/release/app-release.apk

Les jetons sont encapsulés sous result:

const login = await SocialLogin.login({ provider: 'google' });
const idToken = login.result?.idToken;

Pour Firebase Auth, créez des informations d'identification avec cela idToken et utilisez l'ID du client Web comme webClientId dans initialize.

Si vous ne pouvez pas obtenir le certificat SHA-1 de développement, essayez un keystore personnalisé. ce commentaire d'incident Continuez de la section Google Login sur Android

Si vous utilisez Google Login sur Android pour planifier l'authentification et les flux de compte, connectez-l’avec Utilisation de @capgo/capacitor-social-login pour le détail d'implémentation dans Utilisation @capgo/capacitor-social-login, Utilisation @capgo/capacitor-social-login pour le détail d'implémentation dans @capgo/capacitor-social-login, Utilisation @capgo/capacitor-passkey pour le détail d'implémentation dans @capgo/capacitor-passkey, Utilisation @capgo/capacitor-native-biometric pour le détail d'implémentation dans @capgo/capacitor-native-biometric, et L'authentification à deux facteurs pour les détails d'implémentation dans l'authentification à deux facteurs.