Passer au contenu

Apple Migration de connexion vers @capgo/social-login

Ce guide décrit la transition de l’ancien plugin @capacitor-community/apple-sign-in au package moderne @capgo/capacitor-social-login. Le nouveau plugin fournit une interface unifiée pour plusieurs fournisseurs d’authentification sociale avec une prise en charge améliorée de TypeScript et une maintenance active.

##Installation

  1. Supprimez l’ancien package :

    Terminal window
    npm uninstall @capacitor-community/apple-sign-in
  2. Installez le nouveau package :

    Terminal window
    npm install @capgo/capacitor-social-login
    npx cap sync
import { SignInWithApple } from '@capacitor-community/apple-sign-in';
import { SocialLogin } from '@capgo/capacitor-social-login';

Changement de clé : le nouveau plugin nécessite une étape d’initialisation qui n’était pas nécessaire auparavant.

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

Remarque importante : Pour iOS, vous fournissez une configuration de base, tandis que Android nécessite des détails supplémentaires, notamment un ID de service et une URL de rappel back-end pour l’authentification OAuth basée sur le Web.

Le processus de connexion passe de plusieurs paramètres à un 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' et des étendues facultatives plutôt que de transmettre des valeurs de configuration individuelles telles que clientId et redirectURI.

Les résultats incluent désormais un objet accessToken avec des détails d’expiration et une section profile structurée, remplaçant le format de réponse plus plat du package d’origine :

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

Le plugin mis à jour introduit des fonctionnalités qui n’étaient pas disponibles dans le prédécesseur :

Checking Login Status

// 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 la fonctionnalité logout().

Modifications spécifiques à la plateforme

Section titled “Modifications spécifiques à la plateforme”

iOS maintient les procédures de configuration familières grâce aux fonctionnalités Xcode :

  1. La configuration iOS reste en grande partie la même. Vous devez encore :
    • Activer la fonctionnalité “Connexion avec Apple” dans Xcode
    • Configurez votre application dans le portail des développeurs Apple
    • Aucune modification de code supplémentaire requise pour iOS

Android bénéficie désormais d’une prise en charge native via l’authentification Web OAuth :

Le nouveau plugin fournit une prise en charge Android prête à l’emploi, mais nécessite une configuration supplémentaire :

  1. Créez un ID de services dans le portail de développeur Apple
  2. Configure a web authentication endpoint
  3. Configurez votre application Android pour gérer le flux OAuth
  4. Backend service configuration is required

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

Le package modernisé fournit :

  1. API unifiées sur plusieurs fournisseurs sociaux (Google, Facebook, Apple)
  2. Typage TypeScript amélioré avec de meilleures définitions de type
  3. Maintenance communautaire active par rapport à la version obsolète
  4. Prise en charge intégrée de Android via l’authentification basée sur le Web
  5. Persistent login state management
  6. Meilleure gestion des erreurs avec des types d’erreurs cohérents

Modifications radicales1. Une initialisation explicite est désormais requise - aucune configuration par défaut

Section titled “Modifications radicales1. Une initialisation explicite est désormais requise - aucune configuration par défaut”
  1. La structure de l’objet de réponse a changé - format de résultat imbriqué
  2. La mise en œuvre de Android nécessite un service backend pour OAuth
  3. La gestion de l’actualisation des jetons est différente - gestion améliorée des jetons
  4. La gestion des erreurs et les types d’erreurs ont changé - erreurs plus détaillées

Pour des instructions de configuration plus détaillées, veuillez vous référer à la documentation officielle.