Apple Supabase ログイン - 一般設定

インストール、同期、ソースマークダウンガイドを含む

概要

Apple Sign-InとSupabase Authenticationを統合するためのガイドです。Apple Sign-Inは、iOS、Android、Webプラットフォームを対象とした安全でプライバシーに焦点を当てた認証方法を提供します。

前提条件

1. 開始する前に、以下のことを確認してください。

2. Supabaseプロジェクトを作成 Apple Login General Setup Apple OAuth認証の設定ガイド

3. 各プラットフォームのプラットフォーム固有のガイドを参照して、Apple OAuth認証の設定を実施します。

   • Androidの設定
   • iOSの設定
   • Webの設定

   注意

   Supabaseのチュートリアルを開始する前に、使用するプラットフォームのクライアントIDを生成する必要があります。

   iOSの場合、クライアントIDはアプリIDと同じです。 AndroidとWebの場合、クライアントIDはサービスIDと同じです。 このガイドのステップ7で使用します。

SupabaseでApple OAuthプロバイダを有効化する

1. Go to your Supabase ダッシュボード

2. プロジェクトをクリックしてください

   

3. ここに移動してください Authentication メニュー

   

4. タブをクリックしてください Providers プロバイダー

   

5. Apple プロバイダー Apple プロバイダー

   

6. Appleログインを有効にします。 Apple プロバイダー

   

7. クライアントIDの設定を入力してください。

   注意

   Appleログインを使用している場合、iOSの場合のクライアントIDはアプリIDと同じです。AndroidまたはWebの場合のクライアントIDはサービスIDと同じです。両方を使用している場合、両方のアプリIDとサービスIDを提供する必要があります。

   

8. ボタンをクリックしてください。 Save Supabase Apple プロバイダーを保存

   

   注意

   あなたは 設定する必要はありません。 Capgoは、Appleログインのカスタムバックエンド実装を取り扱います。 Secret key (for OAuth)Voilà、Supabase認証とApple Sign-Inを有効にしました！

認証ヘルパーを使用する

認証ヘルパーを使用する

Apple Sign-Inをプラットフォーム固有の設定で初期化します。 authenticateWithAppleSupabase() 認証フローを取り扱います (iOSではネイティブ、Android/WebではOAuthリダイレクト)

• Apple Sign-Inのフローを取り扱うヘルパー関数が含まれます。
• 認証フローを取り扱います (iOSではネイティブ、Android/WebではOAuthリダイレクト)
• AppleのIDトークンを抽出します
• AppleのIDトークンを使用してSupabaseにサインインします

完全な実装

完全な実装は 例のアプリの supabaseAuthUtils.ts ファイルにあります。

基本的な使用方法

import { authenticateWithAppleSupabase } from './supabaseAuthUtils';

const result = await authenticateWithAppleSupabase();
if (result.success) {
  console.log('Signed in:', result.user);
  // Navigate to your authenticated area
} else {
  console.error('Error:', result.error);
}

「これはどうやって動くのか」

プラットフォーム固有の差異を自動的に処理するヘルパー関数があります:

• iOS: Apple Sign-Inを使用します (リダイレクト URLが必要ありません、自動的にバンドル IDを使用します)
• Android: バックエンドエッジ関数を使用したOAuthリダイレクトフロー (Service IDが必要です)
• Web: OAuthポップアップフローを使用します (Service IDと現在のページURLをリダイレクトとして必要です)

Appleからアイデンティティトークンを取得し、Supabaseに認証するために使用します。 supabase.auth.signInWithIdToken().

Supabase Apple Login - General Setupから続けてください

「Supabase Apple Login - General Setup」セクションを使用している場合 「Supabase Apple Login - General Setup」セクションを使用している場合 認証とアカウントフローの計画に役立つため、接続してください。 Using @capgo/capacitor-social-login Using @capgo/capacitor-social-login Using @capgo/capacitor-social-login Using @capgo/capacitor-social-login Using @capgo/capacitor-passkey Using @capgo/capacitor-passkey Using @capgo/capacitor-native-biometric Using @capgo/capacitor-native-biometric 2要素認証 2要素認証