Passer à la navigation

Supabase Google Login sur iOS

GitHub

Ce guide vous aidera à intégrer l'authentification Google Sign-In avec Supabase sur iOS. Il est supposé que vous avez déjà complété :

La mise en œuvre complète est disponible dans le fichier de l'application d'exemple. Cette guide explique les principaux concepts et comment l'utiliser. supabaseAuthUtils.ts Utilisation de l'Aideur d'authentification

Section intitulée « Utilisation de l'Aideur d'authentification »

La

fonction gère l'ensemble de la chaîne d'authentification : authenticateWithGoogleSupabase Copier dans le presse-papier

import { authenticateWithGoogleSupabase } from './supabaseAuthUtils';
const result = await authenticateWithGoogleSupabase();
if (result.success) {
console.log('Signed in:', result.user);
// Navigate to your authenticated area
} else {
console.error('Error:', result.error);
}

Section intitulée « Comment ça marche »

La fonction gère l'ensemble de la chaîne d'authentification :

Pour une explication détaillée de la façon dont le flux d'authentification fonctionne, y compris la génération de nonce, la validation de JWT et l'inscription Supabase, voir la section La section « Comment ça marche » dans le guide de configuration générale.

Problème de Caching de Nonces iOS

Sur iOS, Google Sign-In peut stocker les jetons, ce qui peut entraîner une échec de la validation de nonce. La validateJWTToken La fonction détecte cela et gère automatiquement :

  1. Détection Automatique : La fonction vérifie si la nonce du jeton correspond à la nonce attendue nonceDigest
  2. Réessai Automatique: Si la validation échoue, il se déconnecte automatiquement de Google et réessaye une fois
  3. Gestion des erreurs: Si la réessayer échoue également, une erreur est renvoyée

Pourquoi cela se produit: L'authentification Google sur iOS SDK cache les jetons pour des raisons de performance. Lorsqu'un jeton stocké est renvoyé, il peut avoir été généré avec un nonce différent (ou aucun nonce), ce qui entraîne une incompatibilité.

La solution: La mise en œuvre gère automatiquement cela en se déconnectant et en réessayant, ce qui oblige Google à générer un jeton frais avec le nonce correct.

Solution de contournement manuelle (si la réessayer automatique ne fonctionne pas):

// Logout first to clear cached tokens
await SocialLogin.logout({ provider: 'google' });
// Then authenticate
const result = await authenticateWithGoogleSupabase();

Cela garantit que le jeton frais est obtenu avec le nonce correct.

Pour la référence complète code, voir la Complete la section de référence Code dans le guide de configuration générale.

La mise en œuvre de nonce suit le modèle de la documentation de React Native Google Sign In se rend à Supabase’s:

  • rawNonce Supabase fait une hachage de signInWithIdToken()
  • et la compare avec le rawNonce qui est inclus dans le jeton d'ID de Google Sign-In nonceDigest (hachage SHA-256, encodé en hexadécimal) se rend au
  • nonceDigest (hachage SHA-256, encodé en hexadécimal) se rend au nonce paramètre dans les API de connexion Google

Le authenticateWithGoogleSupabase La fonction comprend un retry paramètre :

  • Première appel (retry=false): Si la validation échoue, se déconnecte automatiquement et réessaye une fois
  • Appel de relecture (retry=true): Si la validation échoue à nouveau, renvoie immédiatement une erreur

Cela résout automatiquement le problème de cache de jeton iOS.

Si l'authentification échoue :

  • Mauvais nonce: La fonction se réessaye automatiquement - consultez les journaux de console pour plus de détails. Si cela persiste, déconnectez-vous manuellement en premier
  • Audience non valide: Vérifiez que vos identifiants Client Google correspondent dans la console Google Cloud et Supabase (tous les identifiants de client iOS et Web)
  • Échec de la validation du jeton: Assurez-vous d'utiliser mode: 'online' dans l'appel d'initialisation pour obtenir un idToken
  • Configuration de Info.plist: Assurez-vous que Info.plist a les schémas URL corrects et GIDClientID
  • Examinez les exemple d'application code pour référence

Si vous utilisez Supabase Google Login sur iOS pour planifier l'authentification et les flux de compte, connectez-le avec En utilisant @capgo/capacitor-social-login pour la capacité native dans En utilisant @capgo/capacitor-social-login, @capgo/capacitor-social-login pour le détail d'implémentation dans @capgo/capacitor-social-login, @capgo/capacitor-passkey pour les détails d'implémentation dans @capgo/capacitor-passkey, @capgo/capacitor-native-biometric pour les détails d'implémentation dans @capgo/capacitor-native-biometric, et Authentification à deux facteurs pour les détails d'implémentation dans Authentification à deux facteurs.