Migration zu Apple Sign-In zu @capgo/social-login

Übersicht

Diese Anleitung beschreibt die Übergang vom alten Plugin zum modernen @capacitor-community/apple-sign-in Paket. Das neue Plugin bietet eine einheitliche Schnittstelle für mehrere soziale Authentifizierungsanbieter mit verbessertem TypeScript-Unterstützung und aktiver Wartung. @capgo/capacitor-social-login Installation

Abschnitt mit dem Titel “Installation”

1. Terminalfenster

   npm uninstall @capacitor-community/apple-sign-in

2. Install das neue Paket:

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

Code Änderungen

Änderungen importieren

import { SignInWithApple } from '@capacitor-community/apple-sign-in';
import { SocialLogin } from '@capgo/capacitor-social-login';

Initialisierung

Schlüsseländerung: Die neue Plugin erfordert einen Initialisierungsschritt, der vorher nicht benötigt wurde.

// No initialization needed in old package
// For iOS: Basic configuration
await SocialLogin.initialize({
  apple: {} // Basic iOS configuration
});

// For Android: Additional configuration required
await SocialLogin.initialize({
  apple: {
    clientId: 'YOUR_SERVICE_ID', // Service ID from Apple Developer Portal
    redirectUrl: 'https://your-backend.com/callback' // Your backend callback URL
  }
});

Wichtiger Hinweis: Für iOS bereitstellen Sie grundlegende Konfigurationen, während Android zusätzliche Details erfordert, einschließlich einer Service-ID und einem Backend-Callback-URL für webbasierte OAuth-Authentifizierung.

Anmelden

Der Anmeldevorgang vereinfacht sich von mehreren Parametern zu einem sauberen API:

const result = await SignInWithApple.authorize({
  clientId: 'com.your.app',
  redirectURI: 'https://your-app.com/callback',
  scopes: 'email name',
  state: '12345',
  nonce: 'nonce'
});

const result = await SocialLogin.login({
  provider: 'apple',
  options: {
    // Optional: Add scopes if needed
    scopes: ['email', 'name'],
    nonce: 'nonce'
  }
});

Der neue Plugin verwendet login() mit provider: 'apple' und optionalen Berechtigungen anstatt einzelne Konfigurationswerte wie clientId und redirectURI.

Änderungen des Antworttyps

Die Ergebnisse umfassen nun ein accessToken Objekt mit Abgabedetails und einer strukturierten profile Abschnitt, der die flache Antwortformat des Originalpaketes ersetzt:

// Old response type
interface AppleSignInResponse {
  response: {
    user: string;
    email: string | null;
    givenName: string | null;
    familyName: string | null;
    identityToken: string | null;
    authorizationCode: string | null;
  };
}

// New response type
interface SocialLoginResponse {
  provider: 'apple';
  result: {
    accessToken: {
      token: string;
      expiresIn?: number;
      refreshToken?: string;
    } | null;
    idToken: string | null;
    profile: {
      user: string;
      email: string | null;
      givenName: string | null;
      familyName: string | null;
    };
  };
}

Neue Funktionen

Das aktualisierte Plugin bietet Funktionen, die im Vorgänger nicht verfügbar waren:

Anmeldung überprüfen

// Not available in old package
const status = await SocialLogin.isLoggedIn({
  provider: 'apple'
});

Abmeldefunktion

// Not available in old package
await SocialLogin.logout({
  provider: 'apple'
});

Diese Methoden bieten isLoggedIn() um die Authentifizierungsstatus und logout() Funktionalität an.

Plattformspezifische Änderungen

iOS-Einrichtung

iOS pflegt bekannte Einrichtungsverfahren durch Xcode-Funktionen:

1. Die iOS-Einrichtung bleibt größtenteils gleich. Sie müssen immer noch:
   • Die Funktion „Anmeldung mit Apple“ in Xcode aktivieren
   • Ihre App in der Apple-Entwickler-Portal konfigurieren
   • No additional code Änderungen erforderlich für iOS

Android-Einrichtung

Android erhält nun native Unterstützung über webbasierte OAuth-Authentifizierung:

Das neue Plugin bietet Android-Unterstützung direkt vor der Verpackung, erfordert jedoch zusätzliche Einrichtungen:

1. Erstellen Sie einen Services-ID im Apple-Entwicklerportal
2. Konfigurieren Sie einen Web-Authentifizierungs-Endpunkt
3. Konfigurieren Sie Ihre Android-App zum Handling des OAuth-Flusses
4. Eine Konfiguration des Backend-Dienstes ist erforderlich

Für detaillierte Anweisungen zur Android-Einrichtung, zitieren Sie bitte die Anleitung zur Android-Einrichtung.

Vorteile

Der modernisierte Paket bietet:

1. Einheitliche APIs über mehrere soziale Anbieter (Google, Facebook, Apple)
2. Verbesserte TypeScript-Typisierung mit besseren Typdefinitionen
3. Aktive Wartung durch die Community im Vergleich zur veralteten Version
4. Integrierte Android-Unterstützung durch webbasierte Authentifizierung
5. Verwaltung des persistierenden Login-Zustands
6. Bessere Fehlerbehandlung mit konsistenten Fehlerarten

Änderungen in der Versionsgeschichte

1. Eine explizite Initialisierung ist jetzt erforderlich - keine Standardkonfiguration
2. Die Struktur der Antwortobjekte hat sich geändert - Format für die Ergebnisse in der NESTED-Struktur
3. Für die Android-Implementierung ist ein Backend-Service erforderlich für OAuth
4. Die Token-Refresh-Verwaltung ist anders - Verbesserte Token-Verwaltung
5. Fehlerbehandlung und Fehlerarten haben sich geändert - detailliertere Fehler

Für detailliertere Anweisungen zur Einrichtung, wenden Sie sich bitte an die offizielle Dokumentation.

Fortsetzen Sie von der Migration zum Apple-Sign-In bis @capgo/social-login

Wenn Sie Apple-Sign-In-Migration bis @capgo/social-login zur Planung der Authentifizierung und der Kontoflows verwenden, verbinden Sie es mit Mithilfe von @capgo/capacitor-social-login zur nativen Fähigkeit in Mithilfe von @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 Zweifaktor-Authentifizierung für die Implementierungsdetails in Zweifaktor-Authentifizierung.