diff --git a/src/components/ToastItem.tsx b/src/components/ToastItem.tsx index 75a459d..e9499c2 100644 --- a/src/components/ToastItem.tsx +++ b/src/components/ToastItem.tsx @@ -26,7 +26,7 @@ export default function ToastItem({ toastObj, index }: { toastObj: ToastObj; ind const animation = `toast-blink ${toastObj.time}s ease-in-out forwards`; const toastStyle = twMerge( - 'fixed bottom-5 left-1/2 z-40 flex h-[40px] max-w-150 min-w-[300px] w-[80%] -translate-1/2 items-center justify-center rounded-lg caption-sb shadow-[0_1px_6px_rgba(200,200,200,0.2)]', + 'fixed bottom-5 left-1/2 z-50 flex h-[40px] max-w-150 min-w-[300px] w-[80%] -translate-1/2 items-center justify-center rounded-lg caption-sb shadow-[0_1px_6px_rgba(200,200,200,0.2)]', TOAST_POSITION[toastObj.position], TOAST_DESIGN[toastObj.toastType].style, ); diff --git a/src/hooks/useServerSentEvents.tsx b/src/hooks/useServerSentEvents.tsx index a0b406b..3795fa9 100644 --- a/src/hooks/useServerSentEvents.tsx +++ b/src/hooks/useServerSentEvents.tsx @@ -16,7 +16,7 @@ export const useServerSentEvents = () => { let reconnect: number | undefined; const navigate = useNavigate(); - const recallCountRef = useRef(1); + // const recallCountRef = useRef(1); const accessToken = useAuthStore((state) => state.accessToken); const setAccessToken = useAuthStore((state) => state.setAccessToken); @@ -77,22 +77,20 @@ export const useServerSentEvents = () => { handleOnMessage(event.data); }; - sourceRef.current.onerror = () => { - // 에러 발생시 해당 에러가 45초를 넘어서 발생한 에러인지, 401에러인지 판단할 수 있는게 없어서 그냥 에러 발생하면 reissue 넣는걸로 때움 - callReissue(); - closeSSE(); - recallCountRef.current += 1; - console.log('SSE연결 에러 발생'); - - // 재연결 로직 추가 가능 - if (recallCountRef.current < 5) { + sourceRef.current.onerror = (event) => { + console.log(event); + const errorEvent = event as unknown as { status?: number }; + if (errorEvent.status === 401) { + callReissue(); + closeSSE(); reconnect = setTimeout(connectSSE, 5000); } else { - console.log('5회 이상 에러발생으로 구독기능 제거'); + closeSSE(); + reconnect = setTimeout(connectSSE, 5000); } }; } catch (error) { - console.error(error); + console.log('catch문에서 에러 발생', error); } };