Merge pull request #210 from MBTips/fix/로그인-안되는-문제-해결-1차

fix: 로그인 안되는 문제 해결 1차

Author: junjeeong

src/components/button/KakaoLoginButton.tsx

@@ -1,5 +1,8 @@
 const KakaoLoginButton = () => {
-  const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${import.meta.env.VITE_KAKAO_REST_API_KEY}&redirect_uri=${import.meta.env.VITE_KAKAO_REDIRECT_URI}&response_type=code`;
+  const kakaoRestApiKey = import.meta.env.VITE_KAKAO_REST_API_KEY;
+  const kakaoRedirectUrl = import.meta.env.VITE_KAKAO_REDIRECT_URI;
+
+  const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${kakaoRestApiKey}&redirect_uri=${kakaoRedirectUrl}&response_type=code`;
 
   const handleClick = () => {
     window.location.href = kakaoURL;
@@ -9,7 +12,7 @@ const KakaoLoginButton = () => {
     <button
       type="button"
       onClick={handleClick}
-      className="flex justify-center items-center bg-[#F9E622] hover:opacity-80 rounded-lg w-[320px] h-[56px] font-bold text-black"
+      className="flex h-[56px] w-[320px] items-center justify-center rounded-lg bg-[#F9E622] font-bold text-black hover:opacity-80"
     >
       카카오로 시작하기
     </button>

src/pages/KaKaoLogin.tsx

@@ -11,10 +11,10 @@ const KaKaoLogin = () => {
     const getTokenAndLogin = async () => {
       if (typeof code === "string") {
         try {
-          await login(code);
-          navigate("/");
+          const res = await login(code);
+          if (res.ok) navigate("/");
         } catch (err) {
-          console.error("카카오 로그인에 실패했습니다.");
+          navigate("/error");
         }
       }
     };

src/store/useAuthStore.ts

@@ -5,7 +5,7 @@ import instance from "@/api/axios";
 interface AuthStore {
   isLoggedIn: boolean;
   accessToken: string | null;
-  login: (code: string) => Promise<void>;
+  login: (code: string) => Promise<{ ok: boolean }>;
   logout: () => void;
 }
 
@@ -16,22 +16,27 @@ const useAuthStore = create(
       accessToken: null,
       login: async (code: string) => {
         try {
-          const res = await instance.get(`/api/kakao/login?code=${code}`);
-          if (res.data) {
-            set({
-              isLoggedIn: true,
-              accessToken: res.data as string
-            });
-          }
+          const res = await instance.get(
+            `/api/kakao/login?code=${code}`
+            // + "&redirectUrl=https://localhost:5173/kakao-login"
+          );
+          set({
+            isLoggedIn: true,
+            accessToken: res.data as string
+          });
+          return {
+            ok: true
+          };
         } catch (error) {
-          console.error("Error during login:", error);
+          throw error;
         }
       },
       logout: () => {
         set({
           isLoggedIn: false,
           accessToken: null
         });
+        return { ok: true };
       }
     }),
     {