[feat] jwt 재발급 훅 구현

ticketping/src/component/CheckExpiredToken.js

@@ -0,0 +1,29 @@
+import { axiosInstance } from "../api";
+import { useAppContext, deleteToken, setToken } from "../store";
+
+export const useCheckExpiredToken = () => {
+  const { dispatch } = useAppContext();
+  const { store: { jwtToken }} = useAppContext();
+
+  const checkExpiredToken = async (errorMessage) => {
+    if (errorMessage == "토큰이 만료되었습니다.") {
+      const headers = { Authorization: jwtToken };
+
+      try {
+        const response = await axiosInstance.post(
+          "/api/v1/auth/refresh",
+          {},
+          { headers }
+        );
+        const jwtToken = response.data.data.accessToken;
+
+        dispatch(deleteToken());
+        dispatch(setToken(jwtToken));
+      } catch (err) {
+
+      }
+    }
+  };
+
+  return { checkExpiredToken };
+};

ticketping/src/component/Logout.js

@@ -3,12 +3,16 @@ import { notification } from "antd";
 import { MehOutlined } from "@ant-design/icons";
 import { axiosInstance } from "../api";
 import { useAppContext, deleteToken } from "../store";
+import { useCheckExpiredToken } from "./CheckExpiredToken"; 
 
 export const useLogout = () => {
   const navigate = useNavigate();
   const { dispatch } = useAppContext();
   const { store: { jwtToken } } = useAppContext();
 
+  // 토큰 만료 확인 및 재발급
+  const { checkExpiredToken } = useCheckExpiredToken(); 
+
   const logout = async () => {
     const headers = { Authorization: jwtToken };
 
@@ -24,7 +28,8 @@ export const useLogout = () => {
 
       navigate("/"); 
     } catch (error) {
-      console.error("로그아웃 중 오류 발생:", error);
+      // 토큰 만료 확인 및 재발급
+      checkExpiredToken(error.response.data);
     }
   };