__CAPGO_KEEP_0__

사전 요구 사항

이 가이드는 웹에서 Apple Sign-In을 Supabase 인증과 통합하는 데 도움이 될 것입니다. 다음을 이미 완료한 것으로 가정합니다.

• the Apple Login Web 설정
• __CAPGO_KEEP_0__ Supabase Apple Login - 일반 설정.

Implementation

The complete implementation is available in the __CAPGO_KEEP_0__의 supabaseAuthUtils.ts 파일. 이 안내서에서는 주요 개념과 사용 방법을 설명합니다.

Cloudflare의 인증 도우미를 사용하는 방법

The authenticateWithAppleSupabase __CAPGO_KEEP_0__는 인증 흐름의 모든 단계를 처리합니다:

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

작동 방식

웹에서 Apple Sign-In은 OAuth 팝업 흐름을 사용합니다.

1. 초기화: 플러그인은 Service ID와 현재 페이지 URL을 리다이렉트 URL로 초기화합니다.
2. OAuth 팝업: Apple의 OAuth 페이지를 팝업 창으로 열어줍니다.
3. 사용자 인증: 사용자는 팝업 창에서 Apple과 인증합니다.
4. 사용자 식별 토큰: Apple은 사용자 정보를 포함한 사용자 식별 토큰 (JWT)을 반환합니다.
5. Supabase 인증: Supabase에 identity 토큰을 전송합니다. signInWithIdToken()

웹 플랫폼을 자동으로 감지하고 적절히 구성하는 헬퍼 함수가 있습니다.

중요한 주의 사항

서비스 ID 구성

• 웹은 Android와 동일한 Apple 서비스 ID가 필요합니다.
• 서비스 ID는 Apple Developer Portal에 올바른 Return URL과 함께 구성되어야 합니다.
• Apple Developer Portal에 도메인을 허용된 도메인 목록에 추가하십시오.

리다이렉트 URL

• On 웹에서, 리다이렉트 URL은 자동으로 현재 페이지 URL로 설정됩니다. window.location.href (현재 페이지 URL)
• 애플 개발자 포털에서 Return URL을 구성해야 합니다.
• 애플 개발자 포털에서 URL의 끝에 슬래시가 있는 URL과 없는 URL 모두를 구성해야 합니다.

Supabase Client ID

Supabase에서 Apple 제공자를 구성하세요:

• Client ID: Apple 서비스 ID (예: com.example.app.service)

iOS도 사용 중이면 Supabase의 Client ID 필드에 App ID와 Service ID를 모두 제공해야 합니다 (쉼표로 구분).

Helper Function을 업데이트하세요.

When using the authenticateWithAppleSupabase helper function, you must update the clientId 을 Apple Service ID와 일치하도록

await SocialLogin.initialize({
  apple: {
    clientId: isIOS
      ? undefined // iOS uses bundle ID automatically
      : 'your.service.id.here', // Your Apple Service ID for Web and Android
    redirectUrl: redirectUrl,
  },
});

중요

Replace 'your.service.id.here' Apple Service ID (Apple Developer Portal에서 설정한 실제 값)과 동일한

Troubleshooting

If authentication fails:

• Service ID 불일치code에서 Apple Developer Portal과 일치하는 Service ID를 확인하세요.
• Return URL 미설정현재 페이지 URL (끝에 슬래시가 있는 경우 포함)가 Apple Developer Portal에서 올바르게 설정되어 있는지 확인하세요.
• 팝업 차단브라우저 설정을 확인하세요 - 일부 브라우저는 팝업을 기본적으로 차단합니다.
• 허용된 도메인이 아닙니다.Apple Developer Portal에서 허용된 도메인이 등록되어 있는지 확인하세요.
• Supabase 설정Supabase Apple 제공자 설정에서 Service ID가 올바르게 구성되어 있는지 확인하세요.
• 리뷰 code 예시 앱 for reference

Supabase Apple 로그인에서 계속하기

Capgo를 사용 중이라면 Supabase Apple 로그인에서 계속하기 인증 및 계정 흐름을 계획하고 연결하려면 @capgo/capacitor-social-login을 사용하세요 Capgo에서 @capgo/capacitor-social-login을 사용하는 데 native 기능을 사용하세요. @capgo/capacitor-social-login Capgo에서 @capgo/capacitor-social-login을 사용하는 데 구현 세부 정보를 사용하세요. @capgo/capacitor-passkey @capgo/capacitor-passkey에 대한 구현 세부 정보를 위한 @capgo/capacitor-native-biometric @capgo/capacitor-native-biometric에 대한 구현 세부 정보를 위한, 그리고 두 단계 인증 @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-native-biometric에 대한 구현 세부 정보를 위한 두 단계 인증