Supabase Apple Login - General Setup

このプラグインのインストール手順と全マークダウンガイドを含む設定プロンプトをコピーする。

Overview

This guide will help you integrate Apple Sign-In with Supabase Authentication. Apple Sign-In provides a secure, privacy-focused authentication method that works across iOS, Android, and Web platforms.

Prerequisites

Before starting, ensure you have:

CapgoのSupabaseプロジェクトを作成
Apple Sign-Inの一般設定 Apple Sign-Inの一般設定 Apple OAuth 認証設定のガイド
各プラットフォームのプラットフォーム固有のガイドを参照して、Apple OAuth 認証設定を実施してください。
Supabase のチュートリアルを開始する前に、使用するプラットフォームごとにクライアント ID を生成する必要があります。
iOS の場合、クライアント ID はアプリ ID と同じです。 Android と Web の場合、クライアント ID はサービス ID と同じです。このガイドのステップ 7 で使用します。

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

Go to your Supabase ダッシュボード
プロジェクトをクリックしてください
ここに移動してください Authentication メニュー
タブをクリックしてください Providers プロバイダー
Apple プロバイダー Apple __CAPGO_KEEP_0__
Appleログインを有効にします。 Apple プロバイダー
クライアントIDの設定を入力してください。

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

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

Authentication Helperを使用する

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

__CAPGO_KEEP_0__
__CAPGO_KEEP_0__
AppleのIDトークンを抽出します。
IDトークンを使用してSupabaseにサインインします。

基本的な使用方法

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

Apple から取得した ID トークンを使用して Supabase に対して認証します supabase.auth.signInWithIdToken().

「Supabase Apple Login - General Setup から続けてください」セクション 「Supabase Apple Login - General Setup から続けてください」セクション 認証とアカウントフローの計画に役立つため、Capacitorと接続します。 Using @capgo/capacitor-social-login Capacitorのネイティブ機能のためのUsing @capgo/capacitor-social-login CapacitorのUsing @capgo/capacitor-social-login Capacitorの実装詳細のための@capgo/capacitor-social-login Capacitorの@capgo/capacitor-passkey Capacitorの実装詳細のための@capgo/capacitor-passkey Capacitorの実装詳細のための@capgo/capacitor-native-biometric Capacitorの実装詳細のための@capgo/capacitor-native-biometric、 2要素認証 2要素認証の実装詳細