구글하고 supabase에서 구글 로그인 환경설정 하는 법

로

Google Cloud Console에서 OAuth 설정

프로젝트 선택/생성

https://console.cloud.google.com → 상단에서 프로젝트 선택(또는 새로 만들기)

OAuth 동의 화면 만들기

  • 왼쪽 메뉴 APIs & Services → OAuth 동의 화면
  • 대상 메뉴 : 유저는 외부로 설정
  • App name/지원 이메일 입력
  • 데이터 액세스 메뉴에서 접근 범위 세가지 openid, email, profile

OAuth 클라이언트 만들기

  • 왼쪽 메뉴 APIs & Services > OAuth 동의 화면 > 클라이언트
  • 클라이언트 만들기 진행
  • Application type: 웹 어플리케이션
  • Name: supabase-auth 등

uthorized redirect URIs(가장 중요)

여기에 Supabase 프로젝트 콜백을 넣는다 : https://.supabase.co/auth/v1/callback
Supabase 대시보드 좌상단의 프로젝트 ref(서브도메인)이다.
→ https://abcd1234.supabase.co/auth/v1/callback

Authorized JavaScript origins(권장)

http://localhost:3000
https://your-domain.com
(Vercel 프리뷰 쓰면) https://your-project.vercel.app도 추가

생성 누르고 나오는 팝업에서 ID와 비밀번호를 잘 저장해둔다.

Supabase 대시보드에 붙이기

Provider 활성화

  • Supabase 대시보드 → Authentication → Providers → Google
  • 구글에서 만든 Client ID / Client Secret 각각 붙여넣기
  • Enable 토글 ON → Save

URL Configuration 점검

  • Supabase → Authentication → URL Configuration

Site URL

  • 로컬 개발: http://localhost:3000
  • 배포: https://your-domain.com

Redirect URLs(허용 목록)

  • http://localhost:3000/signin
  • https://your-domain.com/signin
  • (프리뷰 쓰면) https://your-project.vercel.app/signin도 추가