Supabase Apple Login - Allgemeine Einstellungen

Übersicht

Diese Anleitung hilft Ihnen, Apple Sign-In mit Supabase Authentication zu integrieren. Apple Sign-In bietet eine sichere, auf Privatsphäre ausgerichtete Authentifizierungs Methode, die auf iOS, Android und Web-Plattformen funktioniert.

Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass Sie Folgendes haben:

1. Einen Supabase-Projekt erstellt haben

2. Die Anleitung Apple Login General Setup gelesen haben, um Apple OAuth-Zugriffsberechtigungen einzurichten

3. Folgen Sie den jeweils plattform-spezifischen Anleitungen, um die Apple OAuth-Zertifikate für Ihre Zielplattform einzurichten:

   • Android-Einrichtung
   • iOS-Einrichtung
   • Web-Einrichtung

   Hinweis

   Bevor Sie mit der Supabase-Anleitung beginnen, müssen Sie die Client-IDs für die Plattformen erstellen, die Sie verwenden möchten.

   Für iOS ist der Client-ID der gleiche wie Ihr App-ID.

Für Android und Web ist der Client-ID der gleiche wie Ihr Service-ID.

1. Aktivieren Sie den Apple OAuth-Anbieter in Supabase Gehe zu Ihrem

2. Klicken Sie auf Ihr Projekt

   

3. Geht es Ihnen gut, gehen Sie zum Authentication Menü

   

4. Klicken Sie auf die Providers Registerkarte

   

5. Finden Sie den Apple Anbieter

   

6. Aktivieren Sie den Apple Anbieter

   

7. Kunden-ID-Konfiguration einfüllen:

   Hinweis

   Wenn Sie Apple-Login für iOS verwenden, ist die Kunden-ID gleich Ihrer App-ID. Wenn Sie Apple-Login für Android oder Web verwenden, ist die Kunden-ID gleich Ihrer Service-ID. Wenn Sie beide verwenden, müssen Sie sowohl die App-ID als auch die Service-ID bereitstellen.

   

8. Klicken Sie auf den Save Button

   

   Hinweis

   Sie Haben Sie KEINE EINRICHTUNGSANLEITUNG setup Secret key (for OAuth) erforderlich. Wir werden eine benutzerdefinierte Backend-Implementierung durchführen, um das Apple-Login zu handhaben.

Voilà, Sie haben nun Apple Sign-In mit Supabase-Authentifizierung aktiviert 🎉

Mit der Authentifizierungshilfe

Die vollständige Implementierung umfasst eine Hilfsfunktion authenticateWithAppleSupabase() die den gesamten Apple-Sign-In-Flow mit Supabase handhabt. Diese Funktion:

• Initialisiert Apple-Sign-In mit plattform-spezifischer Konfiguration
• Handhabt den Authentifizierungsfluss (native auf iOS, OAuth-Redirect auf Android/Web)
• Entnimmt den Identitäts-Token von Apple
• Anmeldet sich bei Supabase mit dem Identitäts-Token

Vollständige Implementierung

Die vollständige Implementierung ist im Beispiel-App-Datei supabaseAuthUtils.ts verfügbar.

Grundlegende Verwendung

import { authenticateWithAppleSupabase } from './supabaseAuthUtils';

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

Wie es funktioniert

Die Hilfsfunktion handhabt automatisch Plattform-spezifische Unterschiede:

• iOS: Verwendet native Apple-Anmeldung (kein Redirect-URL erforderlich, verwendet automatisch die Bundle-ID)
• Android: Verwendet OAuth-Redirect-Flow mit Backend-Edge-Funktion (erfordert Service-ID)
• Web: Verwendet OAuth-Popup-Flow (erfordert Service-ID und aktuelle Seite-URL als Redirect)

Die Funktion gibt ein Identitäts-Token von Apple zurück, das dann zum Authentifizieren mit Supabase verwendet wird supabase.auth.signInWithIdToken().

Weitermachen von Supabase Apple Login - Allgemeine Einstellungen

Wenn Sie die Authentifizierung und die Kontenflüsse planen Supabase Apple Login - Allgemeine Einstellungen um 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.