Update CORS proxy configuration

This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 15:41:32 +00:00
parent 0f4f426dd4
commit 1c3c4f37e0
5 changed files with 76 additions and 13 deletions

View File

@@ -20,15 +20,15 @@ const ProxyTypeSelector: React.FC<ProxyTypeSelectorProps> = ({
<SelectValue placeholder="프록시 서비스 선택" />
</SelectTrigger>
<SelectContent>
<SelectItem value="corsproxy.io">corsproxy.io ()</SelectItem>
<SelectItem value="cloudflare">Cloudflare Workers ()</SelectItem>
<SelectItem value="corsproxy.io">corsproxy.io</SelectItem>
<SelectItem value="thingproxy">thingproxy.freeboard.io</SelectItem>
<SelectItem value="allorigins">allorigins.win</SelectItem>
<SelectItem value="cors-anywhere">cors-anywhere.herokuapp.com</SelectItem>
<SelectItem value="cloudflare">Cloudflare Workers </SelectItem>
</SelectContent>
</Select>
<p className="text-xs text-gray-500 mt-1">
.
Cloudflare .
</p>
</div>
);

View File

@@ -1,4 +1,3 @@
import { supabase } from '@/lib/supabase';
import {
handleNetworkError,
@@ -7,6 +6,7 @@ import {
verifyServerConnection
} from '@/utils/auth';
import { signInWithDirectApi } from './signInUtils';
import { getProxyType, isCorsProxyEnabled } from '@/lib/supabase/config';
export const signIn = async (email: string, password: string) => {
try {
@@ -14,9 +14,21 @@ export const signIn = async (email: string, password: string) => {
const connectionStatus = await verifyServerConnection();
if (!connectionStatus.connected) {
console.log('서버 연결 실패:', connectionStatus.message);
showAuthToast('서버 연결 실패', connectionStatus.message, 'destructive');
// 프록시 설정 확인 및 추천
const usingProxy = isCorsProxyEnabled();
const proxyType = getProxyType();
let errorMessage = connectionStatus.message;
if (!usingProxy) {
errorMessage = `${errorMessage} (설정에서 Cloudflare CORS 프록시 활성화를 권장합니다)`;
} else if (proxyType !== 'cloudflare') {
errorMessage = `${errorMessage} (설정에서 Cloudflare CORS 프록시로 변경을 권장합니다)`;
}
showAuthToast('서버 연결 실패', errorMessage, 'destructive');
return {
error: { message: `서버 연결에 실패했습니다: ${connectionStatus.message}` },
error: { message: `서버 연결에 실패했습니다: ${errorMessage}` },
user: null
};
}
@@ -66,8 +78,22 @@ export const signIn = async (email: string, password: string) => {
} catch (error: any) {
console.error('로그인 중 예외 발생:', error);
// 프록시 설정 확인 및 추천
const usingProxy = isCorsProxyEnabled();
const proxyType = getProxyType();
// 네트워크 오류 확인
const errorMessage = handleNetworkError(error);
let errorMessage = handleNetworkError(error);
// CORS 또는 네트워크 오류인 경우 Cloudflare 프록시 추천
if (errorMessage.includes('CORS') || errorMessage.includes('네트워크') || errorMessage.includes('연결')) {
if (!usingProxy) {
errorMessage = `${errorMessage} (설정에서 Cloudflare CORS 프록시 활성화를 권장합니다)`;
} else if (proxyType !== 'cloudflare') {
errorMessage = `${errorMessage} (설정에서 Cloudflare CORS 프록시로 변경을 권장합니다)`;
}
}
showAuthToast('로그인 오류', errorMessage, 'destructive');
return { error: { message: errorMessage }, user: null };

View File

@@ -1,6 +1,7 @@
import { supabase } from '@/lib/supabase';
import { parseResponse, showAuthToast, handleNetworkError } from '@/utils/auth';
import { getProxyType, isCorsProxyEnabled } from '@/lib/supabase/config';
/**
* 직접 API 호출을 통한 로그인 시도 (대체 방법)
@@ -13,6 +14,11 @@ export const signInWithDirectApi = async (email: string, password: string) => {
const supabaseUrl = localStorage.getItem('supabase_url') || 'https://a11.ism.kr';
const supabaseKey = localStorage.getItem('supabase_key') || supabase.supabaseKey;
// 프록시 정보 로그
const usingProxy = isCorsProxyEnabled();
const proxyType = getProxyType();
console.log(`CORS 프록시 사용: ${usingProxy ? '예' : '아니오'}, 타입: ${proxyType}`);
// URL에 auth/v1이 이미 포함되어있는지 확인
const baseUrl = supabaseUrl.includes('/auth/v1') ? supabaseUrl : `${supabaseUrl}/auth/v1`;
@@ -178,9 +184,21 @@ export const signInWithDirectApi = async (email: string, password: string) => {
} catch (fetchError) {
console.error('로그인 요청 중 fetch 오류:', fetchError);
const errorMessage = handleNetworkError(fetchError);
showAuthToast('로그인 요청 실패', errorMessage, 'destructive');
// 오류 발생 시 프록시 설정 확인 정보 출력
const usingProxy = isCorsProxyEnabled();
const proxyType = getProxyType();
console.log(`오류 발생 시 CORS 설정 - 프록시 사용: ${usingProxy ? '예' : '아니오'}, 타입: ${proxyType}`);
return { error: { message: errorMessage }, user: null };
// Cloudflare 프록시 추천 메시지 추가
const errorMessage = handleNetworkError(fetchError);
let enhancedMessage = errorMessage;
if (!usingProxy || proxyType !== 'cloudflare') {
enhancedMessage = `${errorMessage} (설정에서 Cloudflare CORS 프록시 사용을 권장합니다)`;
}
showAuthToast('로그인 요청 실패', enhancedMessage, 'destructive');
return { error: { message: enhancedMessage }, user: null };
}
};

View File

@@ -6,7 +6,7 @@ export const getSupabaseUrl = () => {
if (storedUrl) {
// CORS 프록시 설정 확인
const useProxy = localStorage.getItem('use_cors_proxy') === 'true';
const proxyType = localStorage.getItem('proxy_type') || 'corsproxy.io';
const proxyType = localStorage.getItem('proxy_type') || 'cloudflare';
if (useProxy) {
// URL에 이미 프로토콜이 포함되어 있는지 확인
@@ -41,7 +41,7 @@ export const getSupabaseUrl = () => {
proxyUrl = `http://localhost:8080/proxy?url=${encodeURIComponent(urlForProxy)}`;
break;
default:
proxyUrl = `https://corsproxy.io/?${encodeURIComponent(urlForProxy)}`;
proxyUrl = `https://cors-proxy.azurewebsites.net/api/cors-proxy?url=${encodeURIComponent(urlForProxy)}`;
}
console.log('CORS 프록시 URL 생성:', proxyUrl);
@@ -75,7 +75,7 @@ export const setProxyType = (proxyType: string) => {
// 현재 사용 중인 프록시 유형 가져오기
export const getProxyType = () => {
return localStorage.getItem('proxy_type') || 'corsproxy.io';
return localStorage.getItem('proxy_type') || 'cloudflare';
};
// CORS 프록시 사용 여부 확인

View File

@@ -1,5 +1,6 @@
import { supabase } from '@/lib/supabase';
import { getProxyType, isCorsProxyEnabled } from '@/lib/supabase/config';
/**
* CORS 문제 확인
@@ -37,6 +38,11 @@ export const verifyServerConnection = async (): Promise<{
};
}
// 프록시 설정 상태 확인
const usingProxy = isCorsProxyEnabled();
const proxyType = getProxyType();
console.log(`연결 테스트 - CORS 프록시: ${usingProxy ? '사용 중' : '미사용'}, 타입: ${proxyType}`);
// 단순 헬스 체크 요청
try {
const response = await fetch(`${supabaseUrl}/auth/v1/`, {
@@ -92,6 +98,10 @@ export const verifyServerConnection = async (): Promise<{
} catch (error: any) {
console.error('서버 연결 확인 중 오류:', error);
// 프록시 설정 확인
const usingProxy = isCorsProxyEnabled();
const proxyType = getProxyType();
// 오류 유형에 따른 메시지 설정
let errorMessage = '알 수 없는 네트워크 오류';
@@ -111,6 +121,15 @@ export const verifyServerConnection = async (): Promise<{
}
}
// Cloudflare 프록시 추천 메시지 추가
if (errorMessage.includes('CORS') || errorMessage.includes('fetch') || errorMessage.includes('네트워크')) {
if (!usingProxy) {
console.log('CORS 오류 감지, Cloudflare 프록시 사용 권장');
} else if (proxyType !== 'cloudflare') {
console.log('CORS 오류 감지, Cloudflare 프록시로 변경 권장');
}
}
return {
connected: false,
message: errorMessage