From b4346952923de7e4386672971e1b38ab7ca5b2e9 Mon Sep 17 00:00:00 2001 From: "gpt-engineer-app[bot]" <159125892+gpt-engineer-app[bot]@users.noreply.github.com> Date: Sat, 15 Mar 2025 15:56:01 +0000 Subject: [PATCH] Update error message Update error message when signup is not allowed. --- src/components/auth/RegisterForm.tsx | 19 +++++++++++++++++-- src/contexts/auth/signUp.ts | 22 ++++++++++++++++++++++ src/contexts/auth/signUpUtils.ts | 27 ++++++++++++++++++++++++--- src/lib/supabase/config.ts | 6 ++++++ 4 files changed, 69 insertions(+), 5 deletions(-) diff --git a/src/components/auth/RegisterForm.tsx b/src/components/auth/RegisterForm.tsx index 0f29218..696c784 100644 --- a/src/components/auth/RegisterForm.tsx +++ b/src/components/auth/RegisterForm.tsx @@ -1,4 +1,3 @@ - import React, { useState } from "react"; import { useNavigate } from "react-router-dom"; import { Label } from "@/components/ui/label"; @@ -12,6 +11,7 @@ interface RegisterFormProps { signUp: (email: string, password: string, username: string) => Promise<{ error: any; user: any; + redirectToSettings?: boolean; }>; serverStatus: { checked: boolean; @@ -119,12 +119,27 @@ const RegisterForm: React.FC = ({ try { // 회원가입 시도 - const { error, user } = await signUp(email, password, username); + const { error, user, redirectToSettings } = await signUp(email, password, username); if (error) { // 오류 메시지 출력 setRegisterError(error.message || '알 수 없는 오류가 발생했습니다.'); + // 설정 페이지 리디렉션이 필요한 경우 + if (redirectToSettings) { + toast({ + title: "Supabase 설정 필요", + description: "Supabase 설정을 확인하고 올바른 값을 입력해주세요.", + variant: "destructive" + }); + + // 2초 후 설정 페이지로 이동 + setTimeout(() => { + navigate("/supabase-settings"); + }, 2000); + return; + } + // 네트워크 관련 오류인 경우 자세한 안내 if (error.message && ( error.message.includes('fetch') || diff --git a/src/contexts/auth/signUp.ts b/src/contexts/auth/signUp.ts index 42bcd1e..38796e1 100644 --- a/src/contexts/auth/signUp.ts +++ b/src/contexts/auth/signUp.ts @@ -15,6 +15,13 @@ export const signUp = async (email: string, password: string, username: string) console.log('회원가입 시도:', email); + // Supabase anon 키 확인 + const supabaseKey = localStorage.getItem('supabase_key'); + if (!supabaseKey || supabaseKey.includes('your-onpremise-anon-key')) { + showAuthToast('설정 오류', 'Supabase 설정이 올바르지 않습니다. 설정 페이지에서 확인해주세요.', 'destructive'); + return { error: { message: 'Supabase 설정이 올바르지 않습니다. 설정 페이지에서 확인해주세요.' }, user: null }; + } + // 기본 회원가입 시도 try { const { data, error } = await supabase.auth.signUp({ @@ -41,6 +48,14 @@ export const signUp = async (email: string, password: string, username: string) return await signUpWithDirectApi(email, password, username); } + // 401 오류 감지 및 처리 + if (error.message.includes('401') || error.message.includes('권한이 없습니다') || + error.message.includes('Unauthorized') || error.status === 401) { + const errorMessage = '회원가입 권한이 없습니다. Supabase 설정 또는 권한을 확인하세요.'; + showAuthToast('회원가입 실패', errorMessage, 'destructive'); + return { error: { message: errorMessage }, user: null, redirectToSettings: true }; + } + // 기타 오류 처리 let errorMessage = error.message; @@ -87,6 +102,13 @@ export const signUp = async (email: string, password: string, username: string) } catch (error: any) { console.error('기본 회원가입 프로세스 예외:', error); + // 401 오류 감지 및 처리 + if (error.status === 401 || (error.message && error.message.includes('401'))) { + const errorMessage = '회원가입 권한이 없습니다. Supabase 설정 또는 권한을 확인하세요.'; + showAuthToast('회원가입 실패', errorMessage, 'destructive'); + return { error: { message: errorMessage }, user: null, redirectToSettings: true }; + } + // 직접 API 호출로 대체 시도 if (error.message && ( error.message.includes('json') || diff --git a/src/contexts/auth/signUpUtils.ts b/src/contexts/auth/signUpUtils.ts index 524ff81..0cfb6da 100644 --- a/src/contexts/auth/signUpUtils.ts +++ b/src/contexts/auth/signUpUtils.ts @@ -15,6 +15,15 @@ export const signUpWithDirectApi = async (email: string, password: string, usern const proxyUrl = getSupabaseUrl(); // 프록시 적용된 URL const supabaseKey = localStorage.getItem('supabase_key') || supabase.supabaseKey; + // Supabase 키 유효성 검사 + if (!supabaseKey || supabaseKey.includes('your-onpremise-anon-key')) { + return { + error: { message: 'Supabase 설정이 올바르지 않습니다. 설정 페이지에서 확인해주세요.' }, + user: null, + redirectToSettings: true + }; + } + // 프록시 정보 로깅 const usingProxy = isCorsProxyEnabled(); const proxyType = getProxyType(); @@ -49,12 +58,23 @@ export const signUpWithDirectApi = async (email: string, password: string, usern console.log('회원가입 응답 상태:', response.status); + // 401 오류 처리 (권한 없음) + if (response.status === 401) { + showAuthToast('회원가입 실패', '회원가입 권한이 없습니다. Supabase 설정 또는 권한을 확인하세요.', 'destructive'); + return { + error: { message: '회원가입 권한이 없습니다. Supabase 설정 또는 권한을 확인하세요.' }, + user: null, + redirectToSettings: true + }; + } + // HTTP 상태 코드 확인 if (response.status === 404) { showAuthToast('회원가입 실패', '서버 경로를 찾을 수 없습니다. Supabase URL을 확인하세요.', 'destructive'); return { error: { message: '서버 경로를 찾을 수 없습니다. Supabase URL을 확인하세요.' }, - user: null + user: null, + redirectToSettings: true }; } @@ -75,7 +95,8 @@ export const signUpWithDirectApi = async (email: string, password: string, usern error: { message: '회원가입 권한이 없습니다. Supabase 설정 또는 권한을 확인하세요.' }, - user: null + user: null, + redirectToSettings: true }; } @@ -147,7 +168,7 @@ export const signUpWithDirectApi = async (email: string, password: string, usern else if (response.status === 401) { const errorMessage = '회원가입 권한이 없습니다. Supabase 설정 또는 권한을 확인하세요.'; showAuthToast('회원가입 실패', errorMessage, 'destructive'); - return { error: { message: errorMessage }, user: null }; + return { error: { message: errorMessage }, user: null, redirectToSettings: true }; } // 다른 모든 오류 상태 else { diff --git a/src/lib/supabase/config.ts b/src/lib/supabase/config.ts index e7ac566..100f612 100644 --- a/src/lib/supabase/config.ts +++ b/src/lib/supabase/config.ts @@ -82,6 +82,12 @@ export const getSupabaseKey = () => { return 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoiYW5vbiIsImlzcyI6InN1cGFiYXNlIiwiaWF0IjoxNzQyMDQ4NTEwLCJleHAiOjQ4OTU2NDg1MTB9.BZx5MF-HldDju9r4eFwOVp9_qj6GOdkjaG6VrJAYAIg'; }; +// Supabase 키 유효성 검사 +export const isValidSupabaseKey = () => { + const key = getSupabaseKey(); + return key && !key.includes('your-onpremise-anon-key'); +}; + // CORS 프록시 사용 여부 설정 export const useCorsProxy = (enabled: boolean) => { localStorage.setItem('use_cors_proxy', enabled.toString());