Zum Hauptinhalt springen
Capgo-Logo
Tutorial

Setup Supabase-Authentifizierung mit Capacitor Social-Login-Plugin

Erfahren Sie, wie Sie Supabase-Authentifizierung mit dem Capgo Social-Login-Plugin für eine reibungslose Google-, Apple- und Facebook-Authentifizierung in Ihrer Capacitor-App integrieren können.

Martin Donadieu

Martin Donadieu

Content-Marketer
Setup Supabase-Authentifizierung mit Capacitor Social-Login-Plugin

Die Einstellung der Authentifizierung in mobilen Apps kann komplex sein, aber die Combination von Supabase mit dem __CAPGO_KEEP_0__ Social-Login-Plugin macht es einfacher. Diese Anleitung wird Sie durch die Integration der sozialen Authentifizierung (Google, Apple, Facebook) mit Supabase in Ihrer __CAPGO_KEEP_0__-App führen. Warum Supabase mit Social Login verwenden? Warum Supabase mit Social Login verwenden? Capgo Social Login plugin makes it straightforward. This tutorial will guide you through integrating social authentication (Google, Apple, Facebook) with Supabase in your Capacitor app.

Warum Supabase mit Social Login verwenden?

Supabase bietet eine robuste Backend-as-a-Service mit integrierter Authentifizierung, während das @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-Social-Login @capgo/capacitor-social-login Ungetrübte soziale Authentifizierung

  • Sichere Token-Verwaltung
  • Kompatibilität über Plattformen hinweg
  • Echtzeit-Datenbankintegration
  • Integrierte Benutzerverwaltung
  • Voraussetzungen

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

Eine __CAPGO_KEEP_0__-Projekt eingerichtet haben

  • A Capacitor project set up
  • Aktuelle Supabase-Konto und -Projekt
  • Entwicklerkonten für deine ausgewählten sozialen Anbieter (Google, Apple, Facebook)

Schritt 1: Installieren und Konfigurieren des Social-Login-Plugins

Installieren Sie zunächst das Capgo Social-Login-Plugin:

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

Schritt 2: Einrichten des Supabase-Projekts

Erfassen und Konfigurieren Ihres Supabase-Projekts

  1. Erfassen Sie ein Supabase-Projekt:

    • Gehe zu supabase.com und melde dich an/registriere dich
    • Klicken Sie auf “Neues Projekt”
    • Wählen Sie Ihre Organisation
    • Geben Sie ein Projektname (z.B. „MeineApp Auth“)
    • Setzen Sie ein Datenbank-Passwort (speichern Sie dies sicher auf)
    • Wählen Sie Ihre Region (wählen Sie die nächste zu Ihren Benutzern)
    • Klicken Sie auf “Neues Projekt erstellen“

  2. Erlangen Sie Ihre Projektanmeldeinformationen:

    • Gehen Sie einmal erstellt zu Einstellungen > API
    • Kopieren Sie Ihr Projekt-URL (z.B. https://your-project-ref.supabase.co)
    • Kopieren Sie Ihr anon public API-Schlüssel
    • Speichern Sie diese für später in Ihrer App

Konfigurieren Sie die Authentifizierungs-Einstellungen

  1. Konfigurieren Sie allgemeine Authentifizierungs-Einstellungen:

    • Gehe zu Authentifizierung > Einstellungen
    • Unter Allgemeine Einstellungen:
      • Setze Site-URL auf auf die URL deiner App (z.B. https://yourdomain.com oder http://localhost:3000 für Entwicklungszwecke
      • Füge zusätzliche Umleitungs-URLs falls erforderlich: 
        http://localhost:3000
https://yourdomain.com
capacitor://localhost (for mobile apps)

  2. E-Mail-Einstellungen konfigurieren (optional aber empfohlen):

    • Unter E-Mail-Server-Einstellungen, konfigurieren Sie Ihren E-Mail-Anbieter
    • Dies aktiviert E-Mail-Bestätigungen und Passwort-Wiederherstellungen
    • Für die Entwicklung können Sie die integrierte E-Mail-Dienstleistung verwenden

Zugriff auf die Anbieter-Sektion

  1. Gehe zu:
    • Authentifizierung > Anbieter im Supabase-Dashboard Zum Anbieter-Section
    • Sie sehen eine Liste der verfügbaren sozialen Anbieter
    • Jeder Anbieter hat ein Aktivieren Schaltfläche und Konfigurationsoptionen

Kommen wir nun auf jeden sozialen Anbieter in Detail:

Schritt 3: Konfigurieren Sie soziale Anbieter in Supabase

Einrichten von Google-Authentifizierung in Supabase

Erstens, erhalten Sie Ihre Google OAuth-Zertifikate:

Folgen Sie unserem umfassenden Google-Einrichtungsleitfaden: Einrichtung von Google-Authentifizierung

Dieser Leitfaden umfasst:

  • Erstellen eines Google-Cloud- Projekts
  • OAuth 2.0-Zertifikate für Web, iOS und Android einrichten
  • Die Zustimmungsoberfläche konfigurieren
  • Ermitteln Sie die erforderlichen Client-IDs und -Geheimnisse

Nach Abschluss der Google-Einrichtung konfigurieren Sie es in Supabase:

  1. Google-Anbieter in Supabase aktivieren:
    • In Ihrem Supabase-Dashboard gehen Sie zu Authentifizierung > Anbieter
    • Finden Sie Google und klicken Sie es AN
    • Die Konfiguration ausfüllen:
      • Kunden-ID: Ihre Google OAuth Web Kunden-ID (aus dem Google Cloud Console)
      • Kunden-Secret: Ihre Google OAuth Web Kunden-Secret
      • Richtlinien-URL: https://your-project-ref.supabase.co/auth/v1/callback (automatisch ausgefüllt)
    • Klicken “Speichern”

Wichtig: Verwenden Sie den Web Client ID und Web Client Secret in Supabase, auch wenn Sie ein mobiles App entwickeln. Die mobilen Client-IDs werden separat in der Plugin-Konfiguration verwendet.

Einstellung von Apple-Authentifizierung in Supabase

Erhalten Sie Apple-Zugangsdaten:

Folgen Sie unserem detaillierten Apple-Einrichtungsleitfaden: Apple-Authentifizierungseinstellung

Dieses Leitfaden umfasst:

  • Einstellung Ihres Apple-Entwicklerkontos
  • Erstellen von App-IDs und Service-IDs
  • Konfigurieren der Anmeldung mit Apple-Funktion
  • Erstellen der erforderlichen privaten Schlüssel
  • Plattform-spezifische Einrichtung für iOS, Android und Web

Nach Abschluss der Apple-Einrichtung, konfigurieren Sie sie in Supabase:

  1. Aktivieren Sie den Apple-Anbieter in Supabase:
    • Gehe zu Authentifizierung > Anbieter und schalte Apple AN
    • Füllen Sie die Konfiguration:
      • Kunden-ID: Ihre Dienst-ID-Bezeichner (z.B. com.yourapp.signin)
      • Kunden-Secret: Erstellen Sie diesen JWT mithilfe Ihres Apple-Privatschlüssels (siehe Supabase Apple-Dokumentation für die JWT-Formatierung)
      • Richtlinien-URL: https://your-project-ref.supabase.co/auth/v1/callback (automatisch ausgefüllt)
    • Klicken Sie “Speichern”

Hinweis: Die Apple-Authentifizierungseinstellungen sind die komplexesten aufgrund der Anforderungen von Apple an Dienst-IDs, Privatschlüssel und JWT-Generation. Folgen Sie unserer Dokumentation sorgfältig für jede Plattform.

Einstellung von Facebook-Authentifizierung in Supabase

Erhalten Sie Facebook-Zugangsdaten:

Folgen Sie unserem umfassenden Leitfaden zur Facebook-Einrichtung: Einstellung von Facebook-Authentifizierung

Dieser Leitfaden umfasst:

  • Erstellen eines Facebook-Entwicklerkontos und einer App
  • Hinzufügen des Facebook-Login-Produkts
  • Konfigurieren von OAuth-Redirect-URI
  • Erhalten Sie Ihre App-ID, App-Secret und Client-Token
  • Plattform-spezifische Konfiguration für iOS und Android

Nach Abschluss der Facebook-Einrichtung, konfigurieren Sie sie in Supabase:

  1. Facebook-Anbieter in Supabase aktivieren:
    • Gehe zu Authentifizierung > Anbieter und schalte Facebook AN
    • Fülle die Konfiguration ein:
      • Kunden-ID: Deine Facebook-App-ID
      • Kunden-Secret: Dein Facebook-App-Secret
      • Richtlinien-URL: https://your-project-ref.supabase.co/auth/v1/callback (automatisch ausgefüllt)
    • Klicken "Speichern"

Wichtig": Stellen Sie sicher, dass Sie die Supabase-Rückruf-URL (https://your-project-ref.supabase.co/auth/v1/callback) in den Facebook-App-Einstellungen hinzufügen Gültige OAuth-Redirect-URI in den Facebook-Login-Einstellungen.

Wichtige Supabase-Konfigurationshinweise

Zugriffsebene-Sicherheit (RLS):

  • Nach der Einrichtung der Authentifizierung aktivieren Sie RLS auf Ihren Tabellen
  • Gehe zu Datenbank > Tabellen und umschalten RLS aktivieren für jede Tabelle
  • Policies erstellen, um den Zugriff auf Daten auf der Grundlage von authentifizierten Benutzern zu steuern

Benutzerverwaltung:

  • Authentifizierte Benutzer in Authentifizierung > Benutzer anzeigen
  • Authentifizierungsereignisse in Authentifizierung > Protokolle anzeigen
  • E-Mail-Vorlagen in Authentifizierung > E-Mail-Vorlagen einrichten

Konfiguration überprüfen:

  • Benutzen Sie Supabases integrierte Authentifizierungstestwerkzeug
  • Gehe zu Authentifizierung > Benutzer und klicke auf „Benutzer einladen“ um E-Mail-Flüsse zu testen
  • Überprüfe das Protokoll Abschnitt für etwaige Authentifizierungsfehler

Schritt 4: Konfigurieren Sie das Social-Login-Plugin

Jetzt, dass Supabase konfiguriert ist, müssen Sie das Social-Login-Plugin mit den entsprechenden Zugriffsberechtigungen einrichten. Wichtig: Die Plugin benötigt die OAuth-Zertifikate von den ursprünglichen Anbietern (nicht von Supabase), während Supabase die Serverseitige Authentifizierung handhabt.

Wie funktioniert die Authentifizierungsablauf?

Bevor Sie in die Konfiguration eintauchen, verstehen Sie den Ablauf:

  1. Plugin authentifiziert sich mit dem sozialen Anbieter (Google/Apple/Facebook) natively
  2. Plugin erhält Tokens (Zugriffs-Token, ID-Token) vom Anbieter
  3. Ihre App sendet diese Tokens an Supabase über signInWithIdToken()
  4. Supabase validiert die Token mit dem Anbieter und erstellt eine Benutzersitzung
  5. Supabase gibt zurück eigene JWT-Token für Ihre Anwendungsanfragen mit Authentifizierung

Google-Plugin-Konfiguration

Das Plugin benötigt Ihre Web Client ID für alle Plattformen und optional einen iOS Client ID für iOS-spezifische Funktionen:

import { SocialLogin } from '@capgo/capacitor-social-login';

await SocialLogin.initialize({
  google: {
    // Use the same Web Client ID you configured in Supabase
    webClientId: 'YOUR_WEB_CLIENT_ID.apps.googleusercontent.com',
    
    // Optional: iOS Client ID for iOS-specific features
    iOSClientId: 'YOUR_IOS_CLIENT_ID.apps.googleusercontent.com',
    
    // Optional: Request offline access for refresh tokens
    mode: 'offline'
  }
});

Hauptpunkte für Google:

  • Verwenden Sie das Web Client ID (keine Android/iOS Client-IDs) für das webClientId Feld
  • Der Plugin funktioniert auf allen Plattformen mit nur dem Web Client ID
  • Der iOSClientId ist optional und wird nur für iOS-spezifische Google-Funktionen verwendet

Apple-Plugin-Konfiguration

Die Apple-Konfiguration variiert zwischen iOS und Android:

Für iOS (native Apple-Anmeldung):

await SocialLogin.initialize({
  apple: {
    // No additional configuration needed for iOS
    // The plugin uses the native Apple Sign-In capability
  }
});

Für Android/Web (erfordert Service-ID):

await SocialLogin.initialize({
  apple: {
    clientId: 'YOUR_SERVICE_ID', // The Service ID from Apple Developer Portal
    redirectUrl: 'https://your-project-ref.supabase.co/auth/v1/callback'
  }
});

Hauptsachen für Apple:

  • iOS verwendet native Sign in with Apple (keine zusätzliche Konfiguration erforderlich)
  • Android/Web erfordert die Service-ID, die Sie im Apple Developer Portal erstellt haben
  • Die redirectUrl sollte dem entsprechen, was Sie in beiden Apple Developer Portal und Supabase konfiguriert haben

Facebook-Plugin-Konfiguration

Facebook erfordert Ihre App-ID und Client-Token:

await SocialLogin.initialize({
  facebook: {
    appId: 'YOUR_FACEBOOK_APP_ID',        // From Facebook Developer Dashboard
    clientToken: 'YOUR_FACEBOOK_CLIENT_TOKEN', // From Facebook Developer Dashboard
    
    // Optional: Use Facebook Limited Login (for enhanced privacy)
    limitedLogin: false // See our Facebook setup guide for important Limited Login details
  }
});

Hauptsächliche Punkte für Facebook:

  • Verwenden Sie die gleiche App-ID, die Sie in Supabase konfiguriert haben
  • Client-Token finden Sie in den grundlegenden Einstellungen Ihres Facebook-Apps
  • limitedLogin: true ermöglicht Facebooks privacy-fokussierte Limited Login-Funktion (nur iOS)
  • Wichtig: Sehen Sie sich unsere Facebook-Einrichtungsanleitung für detaillierte Informationen zum begrenzten Login, einschließlich Sicherheitsüberlegungen

Vollständige Plugin-Initialisierung

Hier erfahren Sie, wie Sie alle Anbieter gemeinsam initialisieren können:

import { SocialLogin } from '@capgo/capacitor-social-login';

export async function initializeSocialLogin() {
  await SocialLogin.initialize({
    google: {
      webClientId: 'YOUR_WEB_CLIENT_ID.apps.googleusercontent.com',
      mode: 'offline'
    },
    facebook: {
      appId: 'YOUR_FACEBOOK_APP_ID',
      clientToken: 'YOUR_FACEBOOK_CLIENT_TOKEN',
    },
    apple: {
      // iOS: no config needed
      // Android/Web: uncomment the lines below
      // clientId: 'YOUR_SERVICE_ID',
      // redirectUrl: 'https://your-project-ref.supabase.co/auth/v1/callback'
    }
  });
}

Wichtige Hinweise:

  • Aufrufen initialize() einmal wenn Ihre App startet, nicht vor jedem Login
  • Sie benötigen nur die Anbieter zu konfigurieren, die Sie verwenden möchten
  • Die hier angegebenen Anmeldeinformationen stammen von den ursprünglichen Anbietern, nicht von Supabase
  • Stellen Sie sicher, dass die Anbieterkennungen den in Supabase konfigurierten entsprechen

Schritt 5: Einrichten des Supabase-Clients

Installieren Sie den Supabase-Client:

npm install @supabase/supabase-js

Erstellen Sie einen Supabase-Dienst:

// services/supabase.ts
import { createClient } from '@supabase/supabase-js';

const supabaseUrl = 'https://your-project-ref.supabase.co';
const supabaseKey = 'your-anon-public-key';

export const supabase = createClient(supabaseUrl, supabaseKey, {
  auth: {
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});

Schritt 6: Implementierung der Authentifizierungsablauf

Erstellen Sie ein Authentifizierungsdienst, der beide kombiniert:

// services/auth.ts
import { SocialLogin } from '@capgo/capacitor-social-login';
import { supabase } from './supabase';

export class AuthService {
  
  async initializeSocialLogin() {
    await SocialLogin.initialize({
      google: {
        webClientId: 'YOUR_WEB_CLIENT_ID.apps.googleusercontent.com',
      },
      facebook: {
        appId: 'YOUR_FACEBOOK_APP_ID',
        clientToken: 'YOUR_FACEBOOK_CLIENT_TOKEN',
      },
      apple: {} // iOS configuration
    });
  }

  async signInWithGoogle() {
    try {
      const result = await SocialLogin.login({
        provider: 'google',
        options: {
          scopes: ['email', 'profile']
        }
      });

      const googleResult = result.result;
      if (!googleResult) {
        throw new Error('Google login failed');
      }

      // GoogleLoginResponse is a union type - check responseType to determine flow
      if (googleResult.responseType === 'online') {
        // Online mode: use idToken directly with Supabase
        const { data, error } = await supabase.auth.signInWithIdToken({
          provider: 'google',
          token: googleResult.idToken!,
        });
        if (error) throw error;
        return data;
      } else {
        // Offline mode: exchange serverAuthCode on your backend
        // Your backend should exchange the code for tokens and create a Supabase session
        const response = await fetch('/api/auth/google', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ serverAuthCode: googleResult.serverAuthCode })
        });
        return response.json();
      }
    } catch (error) {
      console.error('Google sign-in error:', error);
      throw error;
    }
  }

  async signInWithApple() {
    try {
      const result = await SocialLogin.login({
        provider: 'apple',
        options: {
          scopes: ['email', 'name']
        }
      });

      const { data, error } = await supabase.auth.signInWithIdToken({
        provider: 'apple',
        token: result.result?.identityToken!,
      });

      if (error) throw error;
      return data;
    } catch (error) {
      console.error('Apple sign-in error:', error);
      throw error;
    }
  }

  async signInWithFacebook() {
    try {
      const result = await SocialLogin.login({
        provider: 'facebook',
        options: {
          permissions: ['email', 'public_profile']
        }
      });

      const fbResult = result.result;
      if (!fbResult?.accessToken?.token) {
        throw new Error('Facebook login failed - no access token received');
      }

      // Facebook uses accessToken for Supabase authentication
      const { data, error } = await supabase.auth.signInWithIdToken({
        provider: 'facebook',
        token: fbResult.accessToken.token,
      });

      if (error) throw error;
      return data;
    } catch (error) {
      console.error('Facebook sign-in error:', error);
      throw error;
    }
  }

  async signOut() {
    // Sign out from Supabase
    await supabase.auth.signOut();
    
    // Optionally sign out from social providers
    await SocialLogin.logout({
      provider: 'google' // or 'apple', 'facebook'
    });
  }

  getCurrentUser() {
    return supabase.auth.getUser();
  }

  onAuthStateChange(callback: (event: string, session: any) => void) {
    return supabase.auth.onAuthStateChange(callback);
  }
}

export const authService = new AuthService();

Schritt 7: Implementierung in Ihrer App

Initialisieren Sie den Dienst und bearbeiten Sie die Authentifizierung:

// main.ts or app component
import { authService } from './services/auth';

async function initializeApp() {
  await authService.initializeSocialLogin();
  
  // Listen to auth state changes
  authService.onAuthStateChange((event, session) => {
    if (event === 'SIGNED_IN') {
      console.log('User signed in:', session.user);
      // Redirect to authenticated area
    } else if (event === 'SIGNED_OUT') {
      console.log('User signed out');
      // Redirect to login
    }
  });
}

initializeApp();

Erstellen Sie in Ihrer UI Anmeldebildschirme:

// Login component
async function handleGoogleLogin() {
  try {
    const user = await authService.signInWithGoogle();
    console.log('Signed in with Google:', user);
  } catch (error) {
    console.error('Login failed:', error);
  }
}

async function handleAppleLogin() {
  try {
    const user = await authService.signInWithApple();
    console.log('Signed in with Apple:', user);
  } catch (error) {
    console.error('Login failed:', error);
  }
}

async function handleFacebookLogin() {
  try {
    const user = await authService.signInWithFacebook();
    console.log('Signed in with Facebook:', user);
  } catch (error) {
    console.error('Login failed:', error);
  }
}

async function handleLogout() {
  try {
    await authService.signOut();
    console.log('Signed out successfully');
  } catch (error) {
    console.error('Logout failed:', error);
  }
}

Schritt 8: Plattform-spezifische Konfiguration

iOS-Konfiguration

Für detaillierte Anweisungen zur iOS-Einrichtung, sehen Sie sich unsere plattform-spezifischen Anleitungen an:

Quick summary - Hinzufügen ios/App/App/Info.plist:

<!-- Google Sign-In URL scheme -->
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>YOUR_REVERSED_CLIENT_ID</string>
    </array>
  </dict>
</array>

<!-- Apple Sign-In capability -->
<key>com.apple.developer.applesignin</key>
<array>
  <string>Default</string>
</array>

Folgen Sie den verlinkten Anleitungen für die vollständigen iOS-Einrichtungsanweisungen einschließlich Xcode-Projekt-Konfiguration.

Android-Konfiguration

Für detaillierte Anweisungen zur Android-Einrichtung, siehe unsere plattform-spezifischen Anleitungen:

Wichtige Android-Konfiguration:

1. Holen Sie sich Ihren SHA-1-Fingerprint (erforderlich für Google):

# For debug builds (development)
cd android
./gradlew signingReport

# Look for the SHA1 fingerprint under "Variant: debug"
# Add this SHA1 to your Google Cloud Console Android OAuth client

2. Konfigurieren Sie AndroidManifest.xml - Hinzufügen android/app/src/main/AndroidManifest.xml:

<!-- Internet permission -->
<uses-permission android:name="android.permission.INTERNET" />

<!-- Facebook configuration -->
<meta-data 
  android:name="com.facebook.sdk.ApplicationId" 
  android:value="@string/facebook_app_id"/>
<meta-data 
  android:name="com.facebook.sdk.ClientToken" 
  android:value="@string/facebook_client_token"/>

3. Facebook-Ressourcen hinzufügen __CAPGO_KEEP_0__ android/app/src/main/res/values/strings.xml:

<string name="facebook_app_id">YOUR_FACEBOOK_APP_ID</string>
<string name="facebook_client_token">YOUR_FACEBOOK_CLIENT_TOKEN</string>

Beachten Sie die verlinkten Plattformleitfäden für eine vollständige Android-Konfiguration einschließlich der Einrichtung von Google Play Services und der Paketnamen-Konfiguration.

Schritt 9: Verwendung der Supabase-Datenbank mit authentifizierten Benutzern

Sobald Benutzer authentifiziert sind, können Sie die Supabase-Datenbank mit Row Level Security (RLS) verwenden:

// Example: Fetch user profile
async function getUserProfile() {
  const { data: user } = await supabase.auth.getUser();
  
  if (user) {
    const { data, error } = await supabase
      .from('profiles')
      .select('*')
      .eq('id', user.user.id)
      .single();
    
    return data;
  }
}

// Example: Update user profile
async function updateUserProfile(updates: any) {
  const { data: user } = await supabase.auth.getUser();
  
  if (user) {
    const { data, error } = await supabase
      .from('profiles')
      .update(updates)
      .eq('id', user.user.id);
    
    return data;
  }
}

Wichtige Sicherheitshinweise

  1. Exponieren Sie keine sensiblen Schlüssel in Ihrem Client code
  2. Verwenden Sie Umgebungsvariablen für die Konfiguration
  3. Aktivieren Sie die Row Level Security in Supabase
  4. Überprüfen Sie Token auf Ihrem Backend erforderlichenfalls
  5. Token aktualisieren automatisch mit Supabase

Fehlerbehebung bei häufigen Problemen

Token-Mangelschreibfehler

  • Stellen Sie sicher, dass Ihre OAuth-Anbieter-Konfigurationen zwischen dem Social-Login-Plugin und Supabase übereinstimmen
  • Überprüfen Sie, ob die Redirect-URLs korrekt konfiguriert sind

Plattform-spezifische Probleme

  • iOS: Überprüfen Sie, ob Ihr Bundle-ID mit Ihrer Apple-Entwickler-Konfiguration übereinstimmt
  • Android: Stellen Sie sicher, dass SHA1-Fingerabdrücke korrekt in Google Console hinzugefügt wurden

Unterbrechungen im Authentifizierungsfluss

  • Eine ordnungsgemäße Fehlerbehandlung für Netzwerkprobleme implementieren
  • Während der Authentifizierung Ladezustände hinzufügen

Zusammenfassung

Sie haben jetzt ein vollständiges Authentifizierungssystem, das Supabases robusten Backend mit nativen sozialen Anmeldefunktionen kombiniert. Diese Konfiguration bietet:

  • Sichere, native soziale Anmeldung
  • Störungsfreie Token-Verwaltung
  • Echtzeit-Datenbankintegration
  • Plattformübergreifende Kompatibilität

Die Combination von Supabase und dem Capgo Social Login-Plugin bietet eine leistungsstarke, skalierbare Authentifizierungslösung für Ihre Capacitor Apps.

Für weitere fortgeschrittene Funktionen wie Zweifaktor-Authentifizierung oder Eigene Ansprüche, besuchen Sie die Supabase-Dokumentation und die Dokumentation zum Social-Login-Plugin.

Fortsetzen Sie von Setup Supabase Authentication mit Capacitor Social Login Plugin

Wenn Sie Setup Supabase Authentication mit Capacitor Social Login Plugin zur Planung der Authentifizierung und der Kontenflüsse verwenden, verbinden Sie es mit @capgo/capacitor-social-login zur Implementierungsdetail 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, Zweifaktor-Authentifizierung für die Implementierungsdetails in Zweifaktor-Authentifizierung und SSO (Unternehmen) für die Implementierungsdetails in SSO (Unternehmen).

Echtzeit-Updates für Capacitor-Anwendungen

Wenn ein Web-Schicht-Bug live ist, liefern Sie die Reparatur über Capgo anstatt Tage zu warten, bis die App-Store-Zulassung vorliegt. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Prozess bleiben.

Los geht's

Neueste Beiträge aus unserem Blog

Capgo bietet Ihnen die besten Einblicke, die Sie benötigen, um eine wirklich professionelle mobile App zu erstellen.

Zweiwegkommunikation in Capacitor-Apps
Entwicklung,Mobile,Updates
26. April 2025

Zweiwegkommunikation in Capacitor-Apps

5 häufige Fehler bei OTA-Updates, die vermieden werden sollten
Entwicklung,Sicherheit,Updates
13. April 2025

5 häufige Fehler bei OTA-Updates, die vermieden werden sollten

5 Sicherheitsbest Practices für Live-Updates in mobilen Apps
Entwicklung,Mobile,Updates
14. Januar 2025

5 Sicherheitsbest Practices für Live-Updates in mobilen Apps

Alle Beiträge aus unserem Blog anzeigen