Migrer Apple Sign-In vers @capgo/social-login

Vue d'ensemble

Cette guide décrit la transition de l'ancien plugin vers le package moderne. @capacitor-community/apple-sign-in Le nouveau plugin fournit une interface unifiée pour plusieurs fournisseurs d'authentification sociale avec un meilleur support TypeScript et une maintenance active. @capgo/capacitor-social-login Installation

Section intitulée « Installation »

1. Supprimer l'ancien package :

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

2. Installer le nouveau package :

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

Code Modifications

Importer les modifications

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

Initialisation

Changement clé: Le nouveau plugin nécessite une étape d'initialisation qui n'était pas nécessaire avant.

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

Note importante: Pour iOS, vous fournissez une configuration de base, tandis que l'Android nécessite des détails supplémentaires, notamment un ID de Service et une URL de rappel backend pour l'authentification OAuth basée sur le web.

Se connecter

Le processus de connexion simplifie de plusieurs paramètres à une API plus propre :

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

Le nouveau plugin utilise login() avec provider: 'apple' And, des champs facultatifs de portée plutôt que de passer des valeurs de configuration individuelles comme clientId Et redirectURI.

Les Changements de Type de Réponse

Les résultats incluent désormais un objet avec des détails d'expiration et une structure accessToken Sous-section, remplaçant le format de réponse plus plat de l'ancien package : profile Copier dans le presse-papier

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

Sous-section intitulée « Nouvelles Capacités »

Vérification de l'état de connexion

and optional scopes rather than passing individual configuration values like

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

Fonctionnalité de déconnexion

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

Ces méthodes fournissent isLoggedIn() pour vérifier l'état d'authentification et logout() la fonctionnalité.

Changements spécifiques à la plateforme

Configuration iOS

iOS permet de maintenir des procédures de configuration familières grâce aux capacités de Xcode :

1. La configuration iOS reste principalement la même. Vous avez toujours besoin de :
   • Activer la capacité « Se connecter avec Apple » dans Xcode
   • Configurer votre application dans le Portail des développeurs Apple
   • Aucune modification supplémentaire code requise pour iOS

Configuration Android

Android reçoit désormais un support natif via une authentification OAuth basée sur le web :

Le nouveau plugin fournit un support Android par défaut, mais nécessite une configuration supplémentaire :

1. Créer un ID de service dans le Portail des développeurs Apple
2. Configurer un point de terminaison d'authentification web
3. Configurer votre application Android pour gérer le flux OAuth
4. La configuration du service backend est requise

Pour des instructions de configuration détaillées d'Android, veuillez vous référer au Guide de configuration d'Android.

Avantages clés

Le package modernisé fournit :

1. API unifiées sur plusieurs fournisseurs sociaux (Google, Facebook, Apple)
2. Typage amélioré TypeScript avec de meilleures définitions de type
3. Maintenance de la communauté active par rapport à la version dépréciée
4. Support intégré pour Android Authentification basée sur le web
5. Gestion de l'état de connexion persistant
6. Traitement des erreurs amélioré Avec des types d'erreurs cohérents

Changements majeurs

1. L'initialisation explicite est désormais requise - Pas de configuration par défaut
2. La structure de l'objet de réponse a changé - Format de résultat imbriqué
3. La mise en œuvre Android nécessite un service backend pour OAuth
4. La gestion des jetons est différente - une gestion des jetons améliorée
5. Les modes de gestion des erreurs et les types d'erreurs ont changé - des erreurs plus détaillées

Pour plus de détails sur les instructions de configuration, veuillez vous référer à la documentation officielle.

Continuez de la section intitulée “Continuez de la migration vers Apple Sign-In @capgo/social-login”

la migration vers Apple Sign-In @__CAPGO_KEEP_0__/social-login Apple Sign-In Migration to @capgo/social-login Si vous utilisez la migration vers Apple Sign-In @__CAPGO_KEEP_0__/social-login Utilisation de @capgo/capacitor-social-login pour la capacité native dans Utilisation de @capgo/capacitor-social-login @capgo/capacitor-social-login pour le détail d'implémentation dans @capgo/capacitor-social-login @capgo/capacitor-passkey pour le détail d'implémentation dans @capgo/capacitor-passkey @capgo/capacitor-native-biometric pour le détail d'implémentation dans @capgo/capacitor-native-biometric, et Deux facteurs d'authentification pour le détail d'implémentation dans Deux facteurs d'authentification.