Supabase Apple 로그인 - 일반 설정

개요

애플 시그니 인과 수파베이스 인증을 통합하는 데 도움이 될 것입니다. Apple Sign-In은 iOS, Android 및 Web 플랫폼에서 작동하는 보안 및 개인 정보 보호 인증 방법을 제공합니다.

준비 사항

시작하기 전에 다음을 확인하세요:

1. 수파베이스 프로젝트를 생성했습니다.

2. 애플 로그인 일반 설정 애플 OAuth 인증서 설정 가이드 __CAPGO_KEEP_0__

3. Apple OAuth 인증을 위한 플랫폼별 설정 지침을 따랐습니다.

   • Android 설정
   • iOS 설정
   • 웹 설정

   주의

   Supabase 튜토리얼을 시작하기 전에, 사용할 플랫폼에 따라 클라이언트 ID를 생성해야 합니다.

   iOS의 경우, 클라이언트 ID는 앱 ID와 동일합니다. Android 및 웹의 경우, 클라이언트 ID는 서비스 ID와 동일합니다. 이 가이드의 7단계에서 사용하겠습니다.

Apple OAuth 제공자를 Supabase에서 활성화하는 방법

1. Go to your 설정

2. __CAPGO_KEEP_0__

   

3. __CAPGO_KEEP_0__ Authentication menu

   

4. __CAPGO_KEEP_0__ Providers tab

   

5. __CAPGO_KEEP_0__ Apple __CAPGO_KEEP_0__

   

6. 사용자 프로젝트 클릭 Apple provider

   

7. 클라이언트 ID 설정을 입력하세요:

   주의

   iOS에서 Apple 로그인 사용하는 경우, 클라이언트 ID는 앱 ID와 동일합니다. Android 또는 Web에서 Apple 로그인 사용하는 경우, 클라이언트 ID는 서비스 ID와 동일합니다. 두 가지 모두 사용하는 경우, 앱 ID와 서비스 ID를 모두 제공해야 합니다.

   

8. 버튼 Save 클릭

   

   주의

   당신은 설정하지 않아도 됩니다. 설정하지 않아도 됩니다. Secret key (for OAuth)설정하지 않아도 됩니다.

설정하지 않아도 됩니다.

설정하지 않아도 됩니다.

설정하지 않아도 됩니다. authenticateWithAppleSupabase() 설정하지 않아도 됩니다.

• 설정하지 않아도 됩니다.
• 설정하지 않아도 됩니다.
• 설정하지 않아도 됩니다.
• Supabase와의 identity 토큰으로 로그인합니다.

완전한 Implementation

완전한 Implementation은 예제 앱의 파일에 있습니다. 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);
}

Helper 함수는 플랫폼에 따라 자동으로 다름을 처리합니다.

Section titled “작동 방식”

• iOS: native Apple Sign-In을 사용하여 (redirect URL이 필요하지 않으며, 자동으로 Bundle ID를 사용합니다.)
• Android: OAuth redirect flow를 사용하여 백엔드 Edge Function을 사용합니다 (Service ID가 필요합니다.)
• Web: OAuth popup flow를 사용하여 (Service ID와 현재 페이지 URL을 redirect로 사용합니다.)

Apple에서 반환하는 identity token을 사용하여 Supabase와 인증합니다. supabase.auth.signInWithIdToken().

Supabase Apple Login - General Setup에서 계속하세요

이 경우 애플 Supabase 로그인 - 일반 설정 을 사용하여 인증 및 계정 흐름을 계획하고 연결하세요 Capgo의 @capgo/capacitor-social-login Capgo의 @capgo/capacitor-social-login Capgo의 @capgo/capacitor-social-login Capgo의 @capgo/capacitor-social-login Capgo의 @capgo/capacitor-passkey Capgo의 @capgo/capacitor-passkey Capgo의 @capgo/capacitor-native-biometric Capgo의 @capgo/capacitor-native-biometric Capgo의 두 단계 인증 Capgo의 두 단계 인증