Apple Sign-Inから@capgo/social-loginへの移行

概要

このガイドでは、レガシーの @capacitor-community/apple-sign-in プラグインからモダンな @capgo/capacitor-social-login パッケージへの移行手順を説明します。新しいプラグインは、複数のソーシャル認証プロバイダーに対して統一されたインターフェースを提供し、TypeScript のサポートが強化され、アクティブにメンテナンスされています。

インストール

1. 古いパッケージを削除します:

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

2. 新しいパッケージをインストールします：

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

Code の変更点

インポートの変更

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

初期化

主な変更点：新しいプラグインでは、以前は不要だった初期化ステップが必要です。

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

重要なお知らせ: iOS では基本設定を指定するだけで済みますが、Android では Web ベースの OAuth 認証用に Service ID とバックエンドのコールバック URL などの追加情報が必要です。

サインイン

ログイン処理は複数のパラメータから、よりシンプルな 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'
  }
});

新しいプラグインは login() を使用して provider: 'apple' および任意のスコープを、次のような個別の設定値を渡す代わりに使用します clientId と redirectURI.

レスポンスタイプの変更

結果には次のものが含まれるようになりました: accessToken 有効期限の詳細と構造化された profile セクションを持ち、元のパッケージのフラットなレスポンス形式に置き換わります:

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

新機能

更新されたプラグインは、先行バージョンでは利用できなかった機能を導入します:

ログイン状態の確認

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

ログアウト機能

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

これらのメソッドは isLoggedIn() 認証状態の確認と logout() 機能を提供します。

プラットフォーム固有の変更

iOSのセットアップ

iOSと Xcode の機能を通じて、慣れ親しんだセットアップ手順を維持します:

1. iOS のセットアップはほぼ同じです。引き続き以下が必要です:
   • Xcode で「Sign In with Apple」機能を有効にする
   • Apple Developer Portal でアプリを設定する
   • iOSには追加のcode変更は不要です

Android セットアップ

Androidでは WebベースのOAuth認証によりネイティブサポートが提供されるようになりました:

新しいプラグインはAndroidサポートを標準で提供しますが、追加の設定が必要です:

1. Apple Developer PortalでServices IDを作成します
2. Web認証エンドポイントを構成します
3. AndroidアプリでOAuthフローを処理するように設定します
4. バックエンドサービスの構成が必要です

Androidセットアップの詳細については、 Androidセットアップガイド.

主なメリット

モダン化されたパッケージは以下を提供します:

1. 統合された API 複数のソーシャルプロバイダー（Google、Facebook、Apple）間で
2. 改善された TypeScript 型定義 より良い型定義により
3. アクティブなコミュニティによるメンテナンス 非推奨バージョンと比較して
4. 組み込みの Android サポート Web ベースの認証を通じて
5. 永続的なログイン状態の管理
6. エラーハンドリングの改善 一貫性のあるエラータイプ

破壊的変更

1. 明示的な初期化が必須になりました - デフォルト設定なし
2. レスポンスオブジェクトの構造が変更されました - ネストされた結果形式
3. Android実装にはバックエンドサービスが必要です OAuth用
4. トークンリフレッシュの処理が異なります - トークン管理の改善
5. エラー処理とエラータイプが変更されました - より詳細なエラー

詳細なセットアップ手順については、以下を参照してください： 公式ドキュメント.

Apple Sign-In の移行から @capgo/social-login へ続行する

使用している場合 Apple Sign-Inから@capgo/social-loginへの移行 認証とアカウントフローを計画するには、これを次と連携させてください @capgo/capacitor-social-login の使用 「@capgo/capacitor-social-login の使用」のネイティブ機能のために、 @capgo/capacitor-social-login @capgo/capacitor-social-login の実装の詳細については、 @capgo/capacitor-passkey @capgo/capacitor-passkey の実装詳細については、 @capgo/capacitor-native-biometric @capgo/capacitor-native-biometric の実装の詳細、および 2要素認証 二要素認証の実装の詳細については。