Supabase Apple Login - Configurazione Generale

Panoramica

Questa guida ti aiuterà a integrare l'accesso Apple con l'autenticazione Supabase. L'accesso Apple fornisce un metodo di autenticazione sicuro e focalizzato sulla privacy che funziona su piattaforme iOS, Android e Web.

Requisiti preliminari

Prima di iniziare, assicurati di avere:

1. Creato un progetto Supabase

2. Letto il Setup generale per l'accesso Apple guida per configurare le credenziali OAuth Apple

3. Seguito le guide specifiche per la piattaforma per configurare le credenziali OAuth Apple per la tua piattaforma di destinazione:

   • Configurazione Android
   • Configurazione iOS
   • Configurazione Web

   Nota

   Prima di iniziare il tutorial di Supabase, è necessario generare gli ID client per le piattaforme che pianifica di utilizzare.

   Per iOS, l'ID client è lo stesso del tuo ID applicazione.

Per Android e Web, l'ID client è lo stesso del tuo ID servizio.

1. Abilita il provider OAuth Apple in Supabase Sottosezione intitolata “Abilita il provider OAuth Apple in Supabase”

2. Vai al tuo "Supabase Dashboard" e clicca sul tuo progetto

   

3. Non andare al Authentication menu

   

4. Clicca sul Providers tab

   

5. Trova il Apple provider

   

6. Abilita il Apple provider

   

7. Inserisci la configurazione del ID del client:

   Nota

   Se stai utilizzando il login Apple per iOS, l'ID del client è lo stesso del tuo ID app. Se stai utilizzando il login Apple per Android o Web, l'ID del client è lo stesso del tuo ID servizio. Se stai utilizzando sia iOS che Android o Web, devi fornire sia l'ID app che l'ID servizio.

   

8. Clicca sul Save button

   

   Nota

   You Non è necessario impostazione Secret key (for OAuth)Imposteremo un'implementazione backend personalizzata per gestire l'accesso Apple.

Ecco, hai ora abilitato l'accesso Apple con l'autenticazione Supabase 🎉

Utilizzo dell'helper di autenticazione

L'implementazione completa include una funzione helper authenticateWithAppleSupabase() che gestisce l'intero flusso di accesso Apple con Supabase. Questa funzione:

• Inizializza l'accesso Apple con la configurazione specifica della piattaforma
• Gestisce il flusso di autenticazione (nativo su iOS, redirect OAuth su Android/Web)
• Estrae il token di identità da Apple
• Accede a Supabase con il token di identità

Implementazione Completa

L'implementazione completa è disponibile nel file dell'applicazione di esempio. supabaseAuthUtils.ts Esempio di utilizzo

Sezione intitolata “Esempio di utilizzo”

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

Sezione intitolata “Come Funziona”

iOS

• iOS: Utilizza l'accesso Apple nativo (nessun URL di reindirizzamento necessario, utilizza automaticamente l'ID bundle)
• Android: Utilizza il flusso di reindirizzamento OAuth con funzione di edge backend (richiede ID Servizio)
• Web: Utilizza il flusso di popup OAuth (richiede ID Servizio e URL della pagina corrente come reindirizzamento)

La funzione restituisce un token di identità da Apple, che viene poi utilizzato per autenticare con Supabase utilizzando supabase.auth.signInWithIdToken().

Continua da Supabase Apple Login - Configurazione Generale

Se stai utilizzando Configurazione Generale di Supabase Apple Login per pianificare l'autenticazione e le flussi degli account, connettilo con Utilizza @capgo/capacitor-login sociale per la capacità nativa in Utilizzare @capgo/capacitor-login-social, @capgo/capacitor-login-social per il dettaglio di implementazione in @capgo/capacitor-login-social, @capgo/capacitor-passkey per il dettaglio di implementazione in @capgo/capacitor-passkey, @capgo/capacitor-biometric-nativo per il dettaglio di implementazione in @capgo/capacitor-biometric-nativo, e Autenticazione a due fattori per il dettaglio di implementazione in Autenticazione a due fattori.