Zum Inhalt springen

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

Übersicht

Übersicht

Diese Anleitung beschreibt die Übergang vom alten Plugin zum modernen @capacitor-community/apple-sign-in 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

  1. Terminalfenster

    Zur Vervollständigung in die Zwischenablage kopieren
    npm uninstall @capacitor-community/apple-sign-in
  2. Terminalfenster

    Zur Vervollständigung in die Zwischenablage kopieren
    npm install @capgo/capacitor-social-login
    npx cap sync
import { SignInWithApple } from '@capacitor-community/apple-sign-in';
import { SocialLogin } from '@capgo/capacitor-social-login';

Schlüsseländerung: Die neue Erweiterung erfordert einen Initialisierungsstep, 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
}
});

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

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.

Die Ergebnisse umfassen nun ein accessToken Objekt mit Ablaufdaten und einem strukturierten profile Abschnitt, der die flachere 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;
};
};
}

Das aktualisierte Plugin bietet Funktionen, die in seinem 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 liefern isLoggedIn() um die Authentifizierungsstatus zu überprüfen und logout() Funktionen.

iOS iOS behält die bekannten Einrichtungsverfahren durch Xcode-Funktionen bei:

  1. Die iOS-Einrichtung bleibt weitgehend unverändert. Sie müssen immer noch:
    • Die Funktion „Anmeldung mit Apple“ in Xcode aktivieren
    • Ihre App in der Apple-Entwickler-Portal konfigurieren
    • Keine zusätzlichen code Änderungen erforderlich für iOS

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

Das neue Plugin bietet Android-Unterstützung direkt, erfordert jedoch zusätzliche Einstellungen:

  1. Erstellen Sie einen Services-ID im Apple Developer Portal
  2. Konfigurieren Sie einen Web-Authentifizierungs-Endpunkt
  3. Die Einrichtung Ihres Android-Apps zum Handling des OAuth-Flusses
  4. Die Konfiguration des Backend-Dienstes ist erforderlich

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

Das 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
  1. Eine explizite Initialisierung ist jetzt erforderlich - keine Standardkonfiguration
  2. Die Struktur der Antwortobjekte hat sich geändert - formatierte Ergebnisse in der Ergebnisstruktur
  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. Die Fehlerbehandlung und die Fehlerarten haben sich geändert - detailliertere Fehlermeldungen

Für detailliertere Anweisungen zur Einrichtung, zögern Sie bitte, sich an die Anleitung auf GitHub zu wenden offizielle Dokumentation.

Weitermachen von der Migration zu Apple Sign-In bis @capgo/social-login

Abschnitt mit dem Titel “Weitermachen von der Migration zu Apple Sign-In bis @capgo/social-login”

Wenn Sie Migration zu Apple Sign-In bis @capgo/social-login zur Planung der Authentifizierung und der Kontoflows verwenden, verbinden Sie 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-biometrische Authentifizierung für die Implementierungsdetails in @capgo/capacitor-native-biometrische Authentifizierung, und Zweifaktor-Authentifizierung für die Implementierungsdetails in Zweifaktor-Authentifizierung.