[FEAT] 토큰 만료 시 웹소켓 재연결 및 메시지 재전송 처리

[kimyou1102]

Issue Number

closed #1348

As-Is

• 토큰 만료 상태를 클라이언트가 감지 및 차단하지 못해, 만료된 인증 상태에서도 메시지 전송 요청이 계속 시도됨
• 메시지 단계에 별도 인증 검증이 없어 세션이 유지되는 동안 무제한 채팅이 가능해지는 문제 발생

To-Be

• 토큰 만료 시 재발급을 수행하고, 이후 웹소켓을 재연결하도록 수정
• 에러 프레임 수신 시 명시적으로 웹소켓을 재연결하도록 처리
• 연결이 끊긴 동안 pending 상태로 남아있는 메시지들을 재전송하여 일관성 보장

주요 변경 사항

1. 토큰 만료 대응 로직 추가

      onStompError: async (frame) => {
        const parsedBody = JSON.parse(frame.body);

        if (parsedBody.code === 'TOKEN_EXPIRED') {
          if (isRefreshingRef.current) {
            return;
          }

          isRefreshingRef.current = true;

          try {
            await postReissue();

            if (client.active) {
              await client.deactivate();
            }

            client.activate();
          } catch (e) {
            navigate(PAGE_URL.LOGIN);
            console.error('토큰 재발급 실패:', e);
          } finally {
            isRefreshingRef.current = false;
          }
        }
      },

• STOMP 에러 프레임에서 TOKEN_EXPIRED 코드 감지
• 토큰 재발급 수행 후 웹소켓 deactivate → activate로 재연결
  • STOMP 에러 프레임 수신 시 웹소켓 연결이 종료되므로, 이후 메시지 정상 전송을 위해 명시적으로 재연결 처리
• 재발급 진행 상태를 useRef로 관리하여 다중 에러 발생 시 중복 재발급 방지

2. 메시지 재전송 처리

      onConnect: () => {
        // 채널 구독
        client.subscribe(...)

        // pending 메시지 재전송
        const pendingMessages = messagesRef.current.filter(
          (m) => m.status === 'pending',
        );

        pendingMessages.forEach((msg) => {
          client.publish({
            destination: `/app/chatroom/${chatRoomId}`,
            body: JSON.stringify({
              content: msg.content,
              tempId: msg.tempId,
              messageType: msg.messageType,
            }),
          });
        });

• 낙관적 업데이트된 메시지 중 pending 상태인 항목 탐색
• 재연결 이후 해당 메시지 재전송

Check List

• 테스트가 전부 통과되었나요?
• 모든 commit이 push 되었나요?
• merge할 branch를 확인했나요?
• Assignee를 지정했나요?
• Label을 지정했나요?
• 닫을 이슈 번호를 지정했나요?

(Optional) Additional Description

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feature/1348-stomp-token-expiration-handler

Tip

Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs).
Share your feedback on Discord.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}