Supabase Google Login sur iOS

Introduction

Ce guide vous aidera à intégrer Google Sign-In avec Supabase Authentication sur iOS. Nous partons du principe que vous avez déjà terminé :

• la configuration de Google Login pour iOS
• la Supabase Google Login - Configuration générale.

Implémentation

L'implémentation complète est disponible dans le fichier de l'application d'exemple. supabaseAuthUtils.ts Ce guide explique les concepts clés et comment l'utiliser.

Utilisation de l'Authentication Helper

Le authenticateWithGoogleSupabase la fonction gère l'intégralité du flux d'authentification :

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);
}

Comment ça marche

Pour une explication détaillée du flux d'authentification, incluant la génération de nonce, la validation JWT et la connexion Supabase, consultez la section « Comment ça marche » du guide de configuration générale.

Avertissements importants

Problèmes de cache de token et de nonce sur iOS

Problème de cache du nonce sur iOS

Sur iOS, Google Sign-In peut mettre les tokens en cache, ce qui peut faire échouer la validation du nonce. La validateJWTToken fonction détecte ce cas et le gère automatiquement :

1. Détection automatique: La fonction vérifie si le nonce du token correspond à celui attendu nonceDigest
2. Réessai automatique: If validation fails, it automatically logs out from Google and retries once
3. Gestion des erreurs: Si le réessai échoue également, une erreur est renvoyée

Pourquoi cela arrive: Le SDK de Google Sign-In sur iOS met les tokens en cache pour améliorer les performances. Lorsqu'un token mis en cache est renvoyé, il peut avoir été généré avec un nonce différent (ou sans nonce), provoquant un décalage.

La solution: L'implémentation gère cela automatiquement en effectuant une déconnexion suivie d'un réessai, ce qui force Google à générer un nouveau token avec le bon nonce.

Solution de contournement manuelle (si le réessai automatique ne fonctionne pas) :

// Logout first to clear cached tokens
await SocialLogin.logout({ provider: 'google' });

// Then authenticate
const result = await authenticateWithGoogleSupabase();

Cela garantit l'obtention d'un nouveau token avec le nonce correct.

Pour la référence code complète, consultez la section « Référence Code complète » du guide de configuration générale.

Notes importantes

Gestion du nonce

L'implémentation du nonce suit le modèle de la documentation React Native Google Sign In:

• rawNonce redirige vers le site de Supabase signInWithIdToken()
• Supabase crée un hash de rawNonce et le compare avec le nonceDigest qui est inclus dans l'ID token de Google Sign-In
• nonceDigest (hash SHA-256, encodé en hex) est envoyé à l' nonce paramètre des API Google Sign-In

Mécanisme de retry automatique

Le authenticateWithGoogleSupabase la fonction inclut un retry paramètre :

• Premier appel (retry=false) : si la validation échoue, déconnexion automatique et un seul retry
• Appel de retry (retry=true) : si la validation échoue à nouveau, renvoie immédiatement une erreur

Cela gère automatiquement le problème de cache du token sur iOS.

Troubleshooting

Si l'authentification échoue :

• Incohérence du nonce: La fonction réessaie automatiquement — consultez les logs de la console pour plus de détails. Si le problème persiste, déconnectez-vous manuellement d'abord
• Audience invalide: Vérifiez que vos Google Client IDs correspondent dans la Google Cloud Console et dans Supabase (les client IDs iOS et Web)
• Échec de la validation du token: Assurez-vous d'utiliser mode: 'online' dans l'appel initialize pour obtenir un idToken
• Configuration du Info.plistAssurez-vous que le fichier Info.plist contient les URL schemes et le GIDClientID corrects
• Consultez l' application exemple code pour référence

Continuer avec Supabase Google Login sur iOS

Si vous utilisez Supabase Google Login sur iOS pour planifier les flux d'authentification et de compte, le connecter à Utiliser @capgo/capacitor-social-login pour la capacité native dans Utiliser @capgo/capacitor-social-login @capgo/capacitor-social-login pour les détails 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 de l'authentification à deux facteurs.