fix: 중복 로그인 허용

src/apis/apiClient.ts

@@ -49,7 +49,13 @@ apiClient.interceptors.response.use(
       try {
         originalRequest.__isRetryRequest = true;
 
-        const refreshResponse = await reissueTokenClient.get("/users/reissue");
+        const deviceId = localStorage.getItem("deviceId");
+
+const refreshResponse = await reissueTokenClient.get("/users/reissue", {
+  headers: {
+    "X-Device-Id": deviceId ?? "",
+  },
+});;
         const newAccessToken = refreshResponse?.data?.data?.accessToken ?? null;
 
         if (!newAccessToken) {

src/components/PageHeader/PageHeader.tsx

@@ -10,6 +10,7 @@ import { useState } from "react";
 import { Link, useNavigate } from "react-router-dom";
 import useUserStore from "@stores/useUserStore";
 import AccountCircleIcon from "@mui/icons-material/AccountCircle";
+import apiClient from "@apis/apiClient";
 import ArrowBackIcon from "@mui/icons-material/ArrowBackIos";
 
 interface PageHeaderProps {
@@ -31,11 +32,38 @@ const PageHeader = ({ title, userName, action }: PageHeaderProps) => {
     setAnchorEl(null);
   };
 
-  const handleLogout = () => {
-    sessionStorage.removeItem("_ZA");
-    clearUser();
-    navigate("/sign-in");
-    handleClose();
+  const handleLogout = async () => {
+    try {
+      const accessToken = sessionStorage.getItem("_ZA");
+      const deviceId = localStorage.getItem("deviceId");
+
+      if (!accessToken || !deviceId) {
+        throw new Error("로그아웃 정보가 부족합니다.");
+      }
+
+      await apiClient.post(
+        "/users/logout",
+        {},
+        {
+          headers: {
+            Authorization: `Bearer ${accessToken}`,
+            "X-Device-Id": deviceId,
+          },
+          withCredentials: true,
+        }
+      );
+
+      sessionStorage.removeItem("_ZA");
+      clearUser();
+      navigate("/sign-in");
+    } catch (error) {
+      console.error("로그아웃 실패", error);      
+      sessionStorage.removeItem("_ZA");
+      clearUser();
+      navigate("/sign-in");
+    } finally {
+      handleClose();
+    }
   };
 
   return (

src/pages/SignInPage/SignInPage.tsx

@@ -18,11 +18,26 @@ const SignInPage = () => {
   const isSignInButtonDisabled = !userId || !password;
 
   const handleClickSignInButton = () => {
+    let deviceId = localStorage.getItem("deviceId");
+    if (!deviceId) {
+      deviceId = crypto.randomUUID(); // 브라우저에서 UUID 생성
+      localStorage.setItem("deviceId", deviceId);
+    }
+
     apiClient
-      .post("/users/login", {
-        id: userId,
-        password,
-      })
+      .post(
+        "/users/login",
+        {
+          id: userId,
+          password,
+        },
+        {
+          headers: {
+            "X-Device-Id": deviceId,
+          },
+          withCredentials: true,
+        }
+      )
       .then((res) => {
         const accessToken = res?.data?.data?.accessToken;
         if (res.status === 200 && accessToken) {