[FRONTEND] vercel 리다이렉트 uri설정 (#50)

- vercel redirect URI 설정

Author: yuhoyeong

frontend/.env

@@ -1,4 +1,4 @@
 VITE_KAKAO_CLIENT_ID=e84faf4e473047e82fd05e50e9b0c0ce
 VITE_KAKAO_AUTH_URL=https://kauth.kakao.com/oauth/authorize
 VITE_KAKAO_REDIRECT_URI=http://localhost:3000/oauth/kakao/redirect
-VITE_API_URL=https://api.com-together.org
+VITE_API_URL=https://api.com-together.org

frontend/KAKAO_OAUTH_SETUP.md

@@ -0,0 +1,33 @@
+# 카카오 OAuth 설정 가이드
+
+## 1. 카카오 디벨로퍼스 콘솔 설정
+
+### 앱 설정 → 플랫폼
+- **Web 사이트 도메인**: `https://com-together.vercel.app`
+
+### 제품 설정 → 카카오 로그인 → Redirect URI
+다음 URI들을 모두 추가:
+- `http://localhost:3000/oauth/kakao/redirect` (개발용)
+- `https://com-together.vercel.app/oauth/kakao/redirect` (프로덕션)
+
+## 2. Vercel 환경 변수 설정
+
+**Vercel Dashboard → com-together → Settings → Environment Variables**
+
+```
+VITE_KAKAO_REDIRECT_URI=https://com-together.vercel.app/oauth/kakao/redirect
+```
+
+## 3. 설정 완료 후
+
+1. Vercel에서 재배포
+2. 브라우저 개발자 도구 콘솔에서 로그 확인:
+   - `🌍 현재 도메인: https://com-together.vercel.app`
+   - `✅ 최종 사용할 REDIRECT_URI: https://com-together.vercel.app/oauth/kakao/redirect`
+
+## 4. 문제 해결
+
+만약 여전히 `localhost:3000`으로 리다이렉트된다면:
+1. 카카오 콘솔에서 URI가 제대로 등록되었는지 확인
+2. Vercel 환경 변수가 제대로 설정되었는지 확인
+3. Vercel에서 재배포 실행

frontend/src/api/userSetting/useKakaoLogin.ts

@@ -64,16 +64,31 @@ export const useKakaoLogin = () => {
     const initiateKakaoLogin = () => {
         setAuthError(null);
 
-        // 동적으로 리다이렉트 URI 생성 (현재 도메인 기반)
+        // 환경 변수와 현재 도메인 정보 로깅
         const currentOrigin = window.location.origin;
-        const redirectUri = import.meta.env.VITE_KAKAO_REDIRECT_URI || `${currentOrigin}/oauth/kakao/redirect`;
+        const envRedirectUri = import.meta.env.VITE_KAKAO_REDIRECT_URI;
+        const isLocalhost = currentOrigin.includes('localhost');
+        const isVercel = currentOrigin.includes('vercel.app');
+        
+        // 환경별 리다이렉트 URI 결정
+        let redirectUri: string;
+        if (isLocalhost) {
+            redirectUri = envRedirectUri || 'http://localhost:3000/oauth/kakao/redirect';
+        } else {
+            redirectUri = envRedirectUri || `${currentOrigin}/oauth/kakao/redirect`;
+        }
+        
+        console.log('🌍 현재 도메인:', currentOrigin);
+        console.log('⚙️ 환경변수 REDIRECT_URI:', envRedirectUri);
+        console.log('🏠 로컬호스트 여부:', isLocalhost);
+        console.log('☁️ Vercel 여부:', isVercel);
+        console.log('✅ 최종 사용할 REDIRECT_URI:', redirectUri);
 
         // prompt=login 추가로 강제 재로그인, nonce 추가로 캐시 방지
         const nonce = Date.now();
         const kakaoAuthUrl = `https://kauth.kakao.com/oauth/authorize?client_id=${import.meta.env.VITE_KAKAO_CLIENT_ID}&redirect_uri=${encodeURIComponent(redirectUri)}&response_type=code&prompt=login&nonce=${nonce}`;
 
         console.log('🔗 카카오 로그인 URL:', kakaoAuthUrl);
-        console.log('📍 리다이렉트 URI:', redirectUri);
 
         window.location.href = kakaoAuthUrl;
     };