Supabase Google OAuth 설정 가이드

1. Google Cloud Console 설정

1.1 프로젝트 생성

1. Google Cloud Console (opens in a new tab) 접속
2. 새 프로젝트 생성
   • 우측 상단의 프로젝트 선택 드롭다운 → [새 프로젝트]
   • 프로젝트 이름 입력 후 [만들기]

1.2 OAuth 동의 화면 설정

1. 좌측 메뉴 → [API 및 서비스] → [OAuth 동의 화면]
2. 사용자 유형 선택
   • 외부 선택 (일반 사용자용)
   • [만들기] 클릭
3. 필수 정보 입력

   - 앱 이름
   - 사용자 지원 이메일
   - 개발자 연락처 정보

1.3 OAuth 클라이언트 ID 생성

1. 좌측 메뉴 → [API 및 서비스] → [사용자 인증 정보]
2. [사용자 인증 정보 만들기] → [OAuth 클라이언트 ID]
3. 애플리케이션 유형: "웹 애플리케이션" 선택
4. 승인된 리디렉션 URI 추가

   https://<your-project>.supabase.co/auth/v1/callback

2. Supabase 프로젝트 설정

2.1 새 프로젝트 생성

(이미 프로젝트 만들었다면 패스)

1. Supabase Dashboard (opens in a new tab) 접속
2. [New Project] 클릭
3. 프로젝트 정보 입력:

   - 프로젝트 이름
   - 데이터베이스 비밀번호
   - 지역 선택

2.2 Google OAuth 제공자 설정

1. 프로젝트 대시보드 → [Authentication] → [Providers]
2. Google 제공자 찾아서 토글 활성화
3. Google Cloud Console에서 생성한 정보 입력:

   - Client ID
   - Client Secret
4. [Save] 클릭

3. 환경변수 설정

프로젝트의 .env.local 파일에 다음 변수들을 추가:

NEXT_PUBLIC_SUPABASE_URL=https://<your-project>.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=<your-anon-key>

주의사항

Google Cloud Console

• OAuth 동의 화면에서 필요한 스코프 추가 필요

  - .../auth/userinfo.email
  - .../auth/userinfo.profile
• 프로덕션 환경으로 전환 시 게시 상태로 변경 필요
• 도메인 및 승인된 리디렉션 URI 정확히 설정

Supabase

• Site URL이 정확히 설정되어 있는지 확인
• 추가 리디렉션 URL이 필요한 경우 Additional Redirect URLs에 추가
• 로컬 개발 시 localhost URL도 추가

문제 해결

자주 발생하는 오류

1. "리디렉션 URI가 허용되지 않음"

   • Google Cloud Console의 승인된 리디렉션 URI 확인
   • Supabase 프로젝트 URL이 정확한지 확인

2. "invalid_client"

   • Client ID와 Secret이 올바르게 입력되었는지 확인
   • OAuth 동의 화면이 제대로 구성되었는지 확인

3. "access_denied"

   • 필요한 스코프가 모두 추가되었는지 확인
   • OAuth 동의 화면의 게시 상태 확인