Einführung der Supabase-Integration

Übersicht

Diese Anleitung führt Sie durch die Einrichtung der Supabase-Authentifizierung mit dem Capacitor-Social-Login-Plugin. Diese Integration ermöglicht Ihnen, native soziale Anmeldeanbieter (Google, Apple, Facebook, Twitter) auf mobilen Plattformen zu verwenden, während Sie die Supabase-Authentifizierung für die Backend-Authentifizierung und PostgreSQL für die Datenspeicherung nutzen.

Wat ihr lernen werdet

• Integrieren des __CAPGO_KEEP_0__-Social-Login-Plugins mit der Supabase-Authentifizierung
• How to integrate Capacitor Social Login plugin with Supabase Auth
• Sichere Verarbeitung von Nonces für Supabase
• Wat ihr benötigt

Übersicht

Einen Supabase-Projekt

1. Einen Supabase-Projekt

   • Ein Projekt erstellen bei Supabase-Dashboard
   • Google OAuth-Anbieter aktivieren
   • Ihre Supabase-Projekt-URL und Anon-Key erhalten

2. Supabase JS SDK

   • Supabase in Ihrem Projekt installieren:

     npm install @supabase/supabase-js

3. Ein Capacitor-Projekt

   • Ein bestehendes Capacitor-Anwendungsprojekt
   • Capacitor-Social-Login-Plugin installiert:

     npm install @capgo/capacitor-social-login
     npx cap sync

4. Plattformspezifische Google-Einrichtung

   • Erledigen Sie die Google-Anmeldeseiteinstellungen für Ihre Zielplattformen:
     • Google-Anmeldung Android-Einrichtung
     • Google-Anmeldung iOS-Einrichtung
     • Google-Anmeldung Web-Einrichtung

Beispielanwendung

Eine vollständige funktionierende Beispielanwendung ist im Repository verfügbar:

Code Repository: Sie finden das code Repository hier

Die Beispielanwendung demonstriert:

• E-Mail-/Passwort-Authentifizierung mit Supabase
• Google-Sign-In-Integration (Android, iOS und Web)
• Einfache Schlüssel-Wert-Speicherung mit Supabase PostgreSQL-Tabellen
• Benutzer-spezifische Daten-Speicherung mit Row Level Security (RLS)

Schlüssel-Implementierungs-Details

Nonce-Verwaltung

Supabase erfordert eine besondere Nonce-Verwaltung zur Sicherheit. Die Implementierung folgt der React Native Google Sign In-Dokumentation:

• Einen rawNonce (URL-sicheren zufälligen String)
• Hashen Sie es mit SHA-256, um zu erhalten nonceDigest
• Passwort nonceDigest zur Google-Anmeldung
• Passwort rawNonce zur Supabase (Supabase hashiert es intern für die Vergleichsliste)

JWT-Validierung

Die Beispielimplementierung enthält eine JWT-Validierung, um sicherzustellen:

• Der Token-Zielgruppe entspricht Ihren konfigurierten Google-Kunden-IDs
• Die Zufallszahl entspricht der erwarteten Digest
• Automatische Wiederholung bei Validierungsfehlern (besonders wichtig für iOS)

Plattform-spezifische Überlegungen

• iOS: Token-Caching kann zu Nichtzahlenproblemen führen - die Implementierung handhabt dies automatisch
• Web: Muss auf dem Mount aufrufen, um OAuth-Redirects zu handhaben isLoggedIn() Android
• : Standard-Implementierung mit SHA-1-Fingerprint-KonfigurationZukünftige Schritte

Plattform-spezifische Überlegungen

Supabase Google Login - Allgemeine Einrichtung

• Weiter mit der Einrichtung - Übersicht und Voraussetzungen
• Android-Einrichtung - Android-spezifische Konfiguration
• iOS-Einrichtung - iOS-spezifische Konfiguration
• Web-Einrichtung - Web-spezifische Konfiguration

Apple Sign-In

• Supabase Apple Login - Allgemeine Einrichtung - Übersicht und Voraussetzungen
• iOS-Einrichtung - iOS-spezifische Konfiguration
• Android-Einrichtung - Android-spezifische Konfiguration

Fortsetzung aus Supabase-Integration-Einführung

Wenn Sie die Verwendung von Supabase-Integration-Einführung um die Authentifizierung und die Kontenflüsse zu planen, verbinden Sie es mit Mit @capgo/capacitor-social-login Für die native Fähigkeit in Mit @capgo/capacitor-social-login, @capgo/capacitor-social-login Für die Implementierungsdetails in @capgo/capacitor-social-login, @capgo/capacitor-passkey für die Implementierungsdetails in @capgo/capacitor-passkey @capgo/capacitor-native-biometric für die Implementierungsdetails in @capgo/capacitor-native-biometric, und Zwei-Faktor-Authentifizierung für die Implementierungsdetails in Zwei-Faktor-Authentifizierung.