Supabase Apple Login on Android

GitHub

__CAPGO_KEEP_4__

__CAPGO_KEEP_11__

이 안내서에서는 Android에서 Supabase 인증과 Apple Sign-In을 통합하는 방법을 설명합니다. 이 안내서를 사용하기 전에 다음을 완료한 것으로 가정합니다.

이 안내서에서는 Android에서 Supabase 인증과 Apple Sign-In을 통합하는 방법을 설명합니다. 이 안내서를 사용하기 전에 다음을 완료한 것으로 가정합니다. Supabase Apple Login - 일반 설정.

Step 1: 백엔드 Edge Function을 배포하기

첫 번째로, Apple OAuth callback을 처리할 Supabase Edge Function을 배포해야 합니다.

프로젝트 디렉토리로 이동하세요
터미널 창
```
cd your-project/supabase
```
에지 함수를 생성하세요 (이미 존재하지 않으면)
터미널 창
```
supabase functions new apple-signin-callback
```
code 에지 함수를 복사하세요

__CAPGO_KEEP_0__ 에지 함수 구현은 예제 앱에서 확인할 수 있습니다. 예제 앱.

다음 파일을 프로젝트로 복사하세요:
- supabase/functions/apple-signin-callback/index.ts - 메인 에지 함수 code
- supabase/functions/apple-signin-callback/deno.json - 의존성 라이브러리의 임포트 맵 (JWT 서명 라이브러리 포함) jose - 의존성 라이브러리의 임포트 맵 (JWT 서명 라이브러리 포함)
__CAPGO_KEEP_0__ 인증 설정

애플 OAuth callback endpoint는 인증이 필요하지 않아야 하므로 Apple이 이를 호출할 수 있도록 공개되어야 합니다. __CAPGO_KEEP_0__을 업데이트하여 supabase/config.toml __CAPGO_KEEP_0__
```
[functions.apple-signin-callback]
enabled = true
verify_jwt = false  # Important: Set to false for public OAuth callback
import_map = "./functions/apple-signin-callback/deno.json"
entrypoint = "./functions/apple-signin-callback/index.ts"
```
중요 verify_jwt = false __CAPGO_KEEP_3__
__CAPGO_KEEP_0__를 공개하여야 합니다. 이는 Apple의 OAuth redirect가 Supabase 인증 헤더를 포함하지 않기 때문입니다. 이 endpoint는 OAuth 흐름을 자체적으로 검증합니다.
__CAPGO_KEEP_0__를 배포
```
supabase functions deploy apple-signin-callback
```
__CAPGO_KEEP_1__를 복사하여 클립보드에 저장하세요. ','__CAPGO_KEEP_0__ URL을 가져오세요

배포 후, URL이 다음과 같은 형태가 될 것입니다.
```
https://your-project-ref.supabase.co/functions/v1/apple-signin-callback
```
URL을 찾을 수 없다면 다음을 수행하세요.
1. 열기 https://supabase.com/dashboard/project/YOUR_PROJECT_REF/functions
2. URL을 클릭하여 복사합니다. apple-signin-callback Apple Sign-In Callback URL
2단계: Apple Developer Portal 구성

2단계: Apple Developer Portal 구성 섹션 제목입니다.

Apple 개발자 Portal을 구성하기 위해 백엔드 URL을 설정하고 필요한 모든 값을 가져야 합니다.

애플 로그인 안드로이드 설정 가이드를 따라해 주십시오.

Complete the 애플 로그인 안드로이드 설정 가이드를 완료하십시오. Create a Service ID
- 개인 키 (.p8 파일)를 생성하십시오.
- 팀 ID와 키 ID를 가져오십시오.
- Return URL을 구성하십시오.
- Configure the Return URL
Apple 개발자 Portal에서 Return URL을 설정하세요.

Apple 개발자 Portal에서 Return URL을 설정할 때 (Apple 가이드의 6.9 단계 참조), Supabase Edge Function URL을 사용하세요:
```
https://your-project-ref.supabase.co/functions/v1/apple-signin-callback
```
중요: Supabase Edge Function URL을 사용하세요
사용하지 마세요 Apple Login Android 설정 가이드에서 제공하는 리다이렉트 URL 그 가이드는 사용자 지정 백엔드 서버 URL을 사용합니다. Supabase 통합을 위해,반드시 Supabase Edge Function URL을 사용해야 합니다. 정확한 일치 필요

The Return URL must match exactly Apple에서 리다이렉션 URI 일치에 매우 엄격합니다.
필요한 모든 값을 수집하세요

Apple 설정 가이드를 완료한 후, 다음 값을 얻어야 합니다.
- APPLE_TEAM_ID: Apple 개발자 팀 ID
- APPLE_KEY_ID: Apple 개발자 포털에서 Key ID
- APPLE_PRIVATE_KEY: Apple Developer Portal에서 .p8 개인 키 파일 (base64 인코딩이 필요합니다)
- ANDROID_SERVICE_ID: __CAPGO_KEEP_0__ (예: com.example.app.service)
- BASE_REDIRECT_URL: __CAPGO_KEEP_0__ (예: capgo-demo-app://path)
Deep Link URL BASE_REDIRECT_URL 은 __CAPGO_KEEP_0__에서 설정된 깊이 링크 스키마입니다. AndroidManifest.xml이것은 인증 후 백엔드가 리다이렉트 될 URL입니다.
__CAPGO_KEEP_0__의 깊이 링크 값은 __CAPGO_KEEP_1__에 따라 달라집니다. android:scheme="capgo-demo-app" code. If you have set android:scheme="capgo-demo-app" __CAPGO_KEEP_1__에 따라 달라집니다. AndroidManifest.xml__CAPGO_KEEP_1__이 설정되어 있다면, 깊이 링크는 capgo-demo-app://path.

Step 3: Supabase Secrets 설정

Supabase Edge Function을 위한 환경 변수(비밀)를 구성해야 합니다.

개인 키를 base64로 인코딩하세요

애플 개인 키 (.p8 파일)를 base64로 인코딩하세요:
터미널 창
```
base64 -i AuthKey_XXXXX.p8
```
복사할 전체 출력(길고 긴 문자열)을 선택하세요.

Supabase CLI를 사용하여 비밀을 설정하세요

supabase secrets set APPLE_TEAM_ID=your_team_id
supabase secrets set APPLE_KEY_ID=your_key_id
supabase secrets set APPLE_PRIVATE_KEY=your_base64_encoded_key
supabase secrets set ANDROID_SERVICE_ID=your.service.id
supabase secrets set BASE_REDIRECT_URL=your-app://path
supabase secrets set APPLE_REDIRECT_URI=https://your-project-ref.supabase.co/functions/v1/apple-signin-callback

Supabase 대시보드에서 비밀을 설정하는 대안입니다.

대시보드를 사용하는 경우:
1. Supabase 프로젝트 대시보드에 가세요.
2. __CAPGO_KEEP_0__로 이동하세요. Edge Functions → 설정 → 비밀
3. 각 비밀 변수에 실제 값을 추가하세요.

Section titled “Step 4: Use the Authentication Helper”

Now you can use the authentication helper in your app code.

__CAPGO_KEEP_0__

The complete implementation is available in the example app의 supabaseAuthUtils.ts file.

Authentication Helper를 사용하는 방법

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 Function을 업데이트

helper function을 사용할 때는 authenticateWithAppleSupabase you는 반드시 must __CAPGO_KEEP_0__을 설정하여 맞춤 설정과 일치시켜 주세요.

__CAPGO_KEEP_1__ redirectUrl - 이에 해당하는 Supabase Edge Function URL을 설정하세요.

const redirectUrl = platform === 'android'
  ? 'https://your-project-ref.supabase.co/functions/v1/apple-signin-callback'
  : undefined;

__CAPGO_KEEP_3__ clientId __CAPGO_KEEP_1__

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

See the 완전한 구현을 참조하십시오. Step 5: Test the Integration

Step 5: Test the Integration

터미널 창
복사
```
npx cap sync android
npx cap run android
```
Apple 로그인 버튼을 탭하십시오.
- Apple OAuth 페이지를 브라우저에서 볼 수 있습니다.
- 인증 후, 앱으로 돌아옵니다.
- __CAPGO_KEEP_0__
- 콘솔 로그를 확인하여 오류가 있는지 확인하세요.
흐름을 확인하세요.

완전한 흐름은 다음과 같습니다.
1. 사용자가 “애플로 로그인” 버튼을 탭합니다.
2. 앱이 애플 OAuth 브라우저를 열어줍니다.
3. 사용자가 애플에 인증합니다.
4. 애플이 다음으로 리다이렉트합니다: https://your-project-ref.supabase.co/functions/v1/apple-signin-callback
5. Edge 함수가 code를 토큰으로 교환합니다.
6. Edge 함수가 다음으로 리다이렉트합니다: your-app://path?id_token=...&access_token=...
7. 안드로이드 앱이 깊이 링크를 수신하고 식별 토큰을 처리합니다.
8. 앱이 식별 토큰으로 Supabase에 로그인합니다.

문제 해결

인증이 실패하면:

URI 재지정 불일치: Apple Developer Portal의 Return URL이 정확히 APPLE_REDIRECT_URI __CAPGO_KEEP_0__
깊이 연결이 작동하지 않음: AndroidManifest.xml intent 필터가 BASE_REDIRECT_URL
비밀번호가 누락됨: supabase secrets list
모든 비밀번호가 토큰 교환 실패함:
앱이 콜백을 받지 않습니다.: 확인 onNewIntent MainActivity에서 __CAPGO_KEEP_0__이 올바르게 구현되어야 합니다.
참고로 예제 앱을 example app code Android에서 Apple Sign-In은 OAuth 리다이렉트 흐름을 사용합니다.

초기화

OAuth Flow

InitializationReview the
example app __CAPGO_KEEP_0__: 애플의 OAuth 페이지에 접속하는 브라우저/Chrome Custom Tab을 열기
백엔드 콜백: 애플이 인증 code를 전달하는 Supabase Edge Function으로 리다이렉트합니다.
토큰 교환: Edge Function이 애플의 토큰 엔드포인트를 사용하여 code를 토큰으로 교환합니다.
깊이 링크 리다이렉트: Edge Function이 앱으로 리다이렉트하여 identity 토큰을 전달합니다.
Supabase 인증: 앱이 토큰을 수신하여 Supabase에 로그인합니다.

이 흐름은 애플이 Sign in with Apple의 네이티브 안드로이드 지원을 제공하지 않기 때문에 필요합니다.

만약 __CAPGO_KEEP_0__을 사용하고 있다면 안드로이드에서 Supabase Apple Login을 사용하여 인증 및 계정 흐름을 계획하고, __CAPGO_KEEP_0__을 __CAPGO_KEEP_1__-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의 구현 세부 정보를 위해, for the implementation detail in @capgo/capacitor-native-biometric, and __CAPGO_KEEP_0__은 __CAPGO_KEEP_1__-social-login의 구현 세부 정보를 위해 사용됩니다. 두 단계 인증 구현 세부 사항에 대한.