Merge pull request #255 from CSE-Shaco/develop

test: add google login test

Author: CSE-Shaco

src/app/test/login_test/page.jsx

@@ -0,0 +1,87 @@
+'use client';
+
+import { useMemo, useState } from 'react';
+import { useAuthenticatedApi } from '@/hooks/useAuthenticatedApi';
+import { useAuth } from '@/hooks/useAuth';
+import { GoogleLogin } from '@/services/auth/signin/google/GoogleLogin';
+
+const NEXT_PATH = '/test/login_test';
+
+export default function LoginTestPage() {
+  const { apiClient } = useAuthenticatedApi();
+  const { accessToken } = useAuth();
+  const { handleGoogleLogin } = GoogleLogin();
+
+  const isLoggedIn = Boolean(accessToken);
+  const maskedToken = useMemo(() => {
+    if (!accessToken) return '-';
+    const head = String(accessToken).slice(0, 8);
+    const tail = String(accessToken).slice(-6);
+    return `${head}...${tail}`;
+  }, [accessToken]);
+
+  const [loading, setLoading] = useState(false);
+  const [httpStatus, setHttpStatus] = useState(null);
+  const [payload, setPayload] = useState(null);
+  const [errorText, setErrorText] = useState('');
+
+  const handleCallTestApi = async () => {
+    setLoading(true);
+    setErrorText('');
+    setPayload(null);
+    setHttpStatus(null);
+    try {
+      const res = await apiClient.get('/test/login_test');
+      setHttpStatus(res.status);
+      setPayload(res.data);
+    } catch (err) {
+      const status = err?.response?.status ?? 'NETWORK_ERROR';
+      setHttpStatus(status);
+      if (err?.response?.data) setPayload(err.response.data);
+      setErrorText(String(err?.message || 'request failed'));
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className='min-h-screen w-full px-6 py-10 text-white'>
+      <h1 className='text-2xl font-bold mb-6'>Google Login Test</h1>
+
+      <section className='mb-6'>
+        <div className='mb-1'>Current login state</div>
+        <div className={`inline-block rounded px-3 py-1 ${isLoggedIn ? 'bg-green-600' : 'bg-red-600'}`}>
+          {isLoggedIn ? 'Logged in' : 'Not logged in'}
+        </div>
+        <div className='mt-2 text-sm text-gray-300'>Access token: {maskedToken}</div>
+      </section>
+
+      <section className='mb-6 flex flex-wrap gap-3'>
+        <button
+          onClick={() => handleGoogleLogin({ next: NEXT_PATH })}
+          className='rounded px-4 py-2 bg-emerald-600 hover:bg-emerald-500'
+        >
+          Start Google Login
+        </button>
+        <button
+          onClick={handleCallTestApi}
+          disabled={loading}
+          className={`rounded px-4 py-2 ${loading ? 'bg-gray-500' : 'bg-blue-600 hover:bg-blue-500'}`}
+        >
+          {loading ? 'Requesting...' : 'Call Test API (/api/v1/test/login_test)'}
+        </button>
+      </section>
+
+      <section>
+        <div className='mb-2 font-semibold'>Response</div>
+        <div className='mb-1 text-sm'>HTTP Status: {httpStatus ?? '-'}</div>
+        {errorText && (
+          <div className='mb-2 text-red-400 text-sm'>Error: {errorText}</div>
+        )}
+        <pre className='bg-black/40 rounded p-3 overflow-auto max-h-[50vh] text-sm'>
+{payload ? JSON.stringify(payload, null, 2) : '-'}
+        </pre>
+      </section>
+    </div>
+  );
+}

src/services/auth/signin/google/GoogleAuth.js

@@ -22,13 +22,29 @@ export const GoogleAuthComponent = () => {
     }
 
     const code = encodeURIComponent(decodedCode);
+    const rawState = searchParams.get('state');
+    let nextPath = null;
+    if (rawState) {
+      try {
+        const decodedState = decodeURIComponent(rawState);
+        if (decodedState.startsWith('/')) {
+          nextPath = decodedState;
+        }
+      } catch {
+        if (rawState.startsWith('/')) {
+          nextPath = rawState;
+        }
+      }
+    }
 
     exchangeGoogleToken(code)
       .then((res) => {
-        const { exists, access_token, email, name } = res.data.data;
+        const data = res?.data?.data || {};
+        const exists = typeof data.exists === 'boolean' ? data.exists : data.isExists;
+        const { access_token, email, name } = data;
         if (exists) {
           setAccessToken(access_token);
-          router.push('/main');
+          router.push(nextPath || '/main');
         } else {
           alert('회원 정보가 없습니다. 회원가입을 완료해주세요.');
           sessionStorage.setItem('signup_email', email);
@@ -53,4 +69,4 @@ export const GoogleAuth = () => (
   <Suspense fallback={<Loader isLoading={true} />}>
     <GoogleAuthComponent />
   </Suspense>
-);
+);

src/services/auth/signin/google/GoogleLogin.js

@@ -1,11 +1,25 @@
 const clientId = process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_CLIENT_ID;
 const redirectUri = process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI;
-const googleLoginUrl = `https://accounts.google.com/o/oauth2/auth?client_id=${clientId}&redirect_uri=${redirectUri}&response_type=code&scope=email profile`;
+const googleLoginBaseUrl = `https://accounts.google.com/o/oauth2/auth?client_id=${clientId}&redirect_uri=${redirectUri}&response_type=code&scope=email profile`;
+
+const buildGoogleLoginUrl = (nextPath) => {
+  if (!nextPath || typeof nextPath !== 'string') {
+    return googleLoginBaseUrl;
+  }
+
+  const trimmed = nextPath.trim();
+  if (!trimmed.startsWith('/')) {
+    return googleLoginBaseUrl;
+  }
+
+  const stateParam = encodeURIComponent(trimmed);
+  return `${googleLoginBaseUrl}&state=${stateParam}`;
+};
 
 export const GoogleLogin = () => {
-  const handleGoogleLogin = () => {
-    window.location.href = googleLoginUrl;
+  const handleGoogleLogin = ({ next } = {}) => {
+    window.location.href = buildGoogleLoginUrl(next);
   };
 
   return {handleGoogleLogin};
-};
+};