diff --git a/ticketping/src/component/CheckExpiredToken.js b/ticketping/src/component/CheckExpiredToken.js new file mode 100644 index 0000000..26c85dc --- /dev/null +++ b/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 }; +}; diff --git a/ticketping/src/component/Logout.js b/ticketping/src/component/Logout.js index 7f954f1..6783fea 100644 --- a/ticketping/src/component/Logout.js +++ b/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); } };