Supabase Apple Login - Configurazione generale

Panoramica

Questa guida ti aiuterà ad integrare l'accesso con Apple con l'autenticazione Supabase. L'accesso con 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 Apple Login Generale guida per configurare le credenziali OAuth Apple

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

   • Setup Android
   • Setup iOS
   • Setup Web

   Nota

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

   For iOS, l'ID del client è lo stesso del tuo ID dell'app. Per Android e Web, l'ID del client è lo stesso del tuo ID del servizio. Li utilizzerai nel passaggio 7 di questa guida.

Abilita il provider OAuth Apple in Supabase

1. Vai al tuo Pannello di controllo di Supabase

2. Clicca sul tuo progetto

   

3. Vai al Authentication menu

   

4. Clicca sulla Providers tab

   

5. Trova il Apple provider

   

6. Abilita il Apple provider

   

7. Riempi le impostazioni dell'ID del client:

   Nota

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

   

8. Clicca sul Save tasto

   

   Nota

   Tu NON DEVI FARE NULLA setup Secret key (for OAuth). Noi faremo un'implementazione backend personalizzata per gestire l'accesso Apple.

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

Utilizzando l'Assistente di Autenticazione

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

• Inizializza l'accesso Apple con una configurazione specifica per 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

La completa implementazione è disponibile nel file dell'applicazione di esempio. supabaseAuthUtils.ts Utilizzo Base

Esempio di App

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

Come funziona

La funzione helper gestisce automaticamente le differenze specifiche delle piattaforme:

• iOS: Utilizza l'accesso di Apple nativo (nessuna URL di reindirizzamento necessaria, utilizza automaticamente l'ID del pacchetto)
• 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 l'URL della pagina corrente come reindirizzamento)

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

Continua da Supabase Apple Login - Configurazione Generale

Se stai utilizzando Supabase Apple Login - Configurazione Generale per pianificare l'autenticazione e le flussi di account, connettilo con Usando @capgo/capacitor-login-social per la capacità nativa in Usando @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-biometria-nativa per i dettagli di implementazione in @capgo/capacitor-biometria nativa, e Autenticazione a due fattori per i dettagli di implementazione in Autenticazione a due fattori.