Merge pull request #92 from innovationacademy-kr/develop

[FE] FIX: 500에러 대응을 위한 isLogin 삭제 및 유효한 토큰 시 /home으로 리다이렉션 #90

src/api/baseAPI.ts

@@ -30,7 +30,6 @@ instance.interceptors.response.use(
       error.response?.status === STATUS_401_UNAUTHORIZED ||
       error.response?.status === undefined
     ) {
-      localStorage.removeItem("isLogin");
       removeCookie();
       clearStorage();
       window.location.href = "/";

src/api/cookie/cookies.ts

@@ -4,12 +4,14 @@ export const getCookie = () => {
   return document.cookie
     .split(";")
     .map((cookie) => cookie.trim())
-    .filter((cookie) => tokenName === cookie.split("=")[0])
-    .join("")
-    .split("=")[1];
+    .find((cookie) => cookie.startsWith(`${tokenName}=`))
+    ?.split("=")[1];
 };
 
 export const removeCookie = (): void => {
-  const domain = ".24hoursarenotenough.42seoul.kr";
+  const hostname = window.location.hostname;
+  const domain =
+    hostname === "localhost" ? "" : ".24hoursarenotenough.42seoul.kr";
+
   document.cookie = `${tokenName}=; path=/; domain=${domain}; expires=Thu, 01 Jan 1970 00:00:01 GMT;`;
 };

src/router/index.ts

@@ -7,7 +7,8 @@ import MoreView from "@/views/MoreView.vue";
 import NotificationView from "@/views/NotificationView.vue";
 import NotFoundViewVue from "@/views/NotFoundView.vue";
 import ApplyCardViewVue from "@/views/ApplyCardView.vue";
-import { getCookie } from "@/api/cookie/cookies";
+import { getCookie, removeCookie } from "@/api/cookie/cookies";
+import { clearStorage } from "@/utils/localStorage";
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
@@ -61,21 +62,25 @@ const router = createRouter({
 
 router.beforeEach((to, from, next) => {
   const token = getCookie();
-  const isLogin = localStorage.getItem("isLogin");
-  if (to.name === "login" && isLogin === "true" && !!token) {
-    next({ name: "home" });
+
+  // 이미 로그인된 상태에서 로그인 페이지로 이동 시 홈으로 리다이렉트
+  const isNavigatingToLogin = to.name === "login";
+  if (isNavigatingToLogin && token) {
+    return next({ name: "home" });
   }
 
-  if (
-    to.name !== "login" &&
-    to.name !== "auth" &&
-    (isLogin !== "true" || !token)
-  ) {
+  // 로그인 및 인증 페이지가 아니고, 토큰이 없는 경우 로그인 페이지로 이동
+  const isProtectedRoute = to.name !== "login" && to.name !== "auth";
+  if (isProtectedRoute && !token) {
+    removeCookie();
+    clearStorage();
     next({ name: "login" });
     alert("로그인 정보가 유효하지 않습니다.\n다시 로그인해주세요.");
-  } else {
-    next();
+    return;
   }
+
+  // 다른 경우는 정상적으로 라우트 진행
+  next();
 });
 
 export default router;

src/views/AuthView.vue

@@ -11,7 +11,6 @@ onMounted(() => {
   setTimeout(async () => {
     const isLogin = await getIsLogin();
     if (isLogin?.status === STATUS_204_NO_CONTENT) {
-      localStorage.setItem("isLogin", "true");
       router.push("/home");
     } else {
       router.push("/");