로그인된 줄 알고 글을 썼는데 튕겨 나가는 '좀비 세션' 문제를 해결하고, 제목과 본문은 물론 댓글 내용까지 찾아내는 통합 검색 기능을 구현했습니다. 이 과정에서 발생한 React Query의 캐시 동기화 이슈와 백엔드 쿼리 누락 문제를 바로잡아 시스템의 안정성을 확보했습니다.
인증 로직 강화 및 좀비 세션 해결
액세스 토큰(Access Token)이 만료되었음에도 UI상으로는 로그인 상태가 유지되는, 이른바 '좀비 세션' 현상이 사용자 경험을 해치고 있었습니다. 사용자는 글쓰기나 좋아요를 누르는 시점에야 401 에러를 마주하고 강제 로그아웃 당하는 불편을 겪었습니다.
이를 해결하기 위해 Axios Interceptor를 고도화했습니다. 401 에러가 감지되면 즉시 리프레시 토큰(Refresh Token)으로 재발급을 시도하도록 로직을 수정했습니다. 갱신에 성공하면 실패했던 원본 요청을 재전송하여, 사용자는 끊김 없이 서비스를 이용할 수 있게 만들었습니다. 만약 갱신에 실패한다면 그제야 로컬 스토리지를 비우고 로그인 페이지로 이동시켜 명확한 인증 흐름을 정립했습니다.
로그아웃 시 데이터 잔존 문제와 캐시 소각

로그아웃 후 다른 아이디로 로그인했음에도, 이전 사용자가 누른 '좋아요' 상태가 화면에 그대로 남아있는 데이터 혼선 문제가 발생했습니다. 확인 결과, 로컬 스토리지는 비워졌지만 React Query가 메모리에 캐싱해둔 데이터가 삭제되지 않은 것이 원인이었습니다.
단순히 브라우저 저장소만 비우는 것으로는 부족했습니다. 로그아웃 버튼 클릭 시 queryClient.clear()를 실행하여 메모리에 상주하던 모든 쿼리 캐시를 즉시 소각하도록 조치했습니다. 덕분에 사용자 전환 시 데이터가 섞이는 무결성 문제를 완벽하게 해결했습니다.
댓글까지 찾아내는 통합 검색 기능 (Outer Join)

단순히 게시글 제목만 검색해서는 커뮤니티의 정보 탐색 욕구를 충족시키기 어렵다고 판단했습니다. 본문은 물론 댓글 내용까지 포함하는 통합 검색 기능을 목표로 백엔드 로직을 확장했습니다.
SQLAlchemy 쿼리에 outerjoin(Comment)를 추가하여 게시글과 댓글 테이블을 연결했습니다. 여기에 or_ 연산자를 사용하여 제목, 내용, 댓글 중 하나라도 키워드가 포함되면 결과에 노출되도록 필터링을 구현했습니다. 이 과정에서 하나의 글에 매칭되는 댓글이 여러 개일 경우 게시글이 중복 출력되는 문제가 있었으나, .distinct() 메서드를 적용하여 중복을 제거하고 깔끔한 목록을 반환하도록 수정했습니다.
Insight
기능 구현만큼이나 중요한 것이 '연결 고리'의 확인임을 배웠습니다. 검색 파라미터를 라우터까지 잘 받아놓고 정작 DB 쿼리에 넘기지 않거나, 조인 조건 없이 필터링을 시도하다 에러를 내는 실수가 있었습니다. 데이터가 흐르는 전체 파이프라인을 꼼꼼히 점검하고, 프론트엔드의 캐시 생명주기까지 고려해야 비로소 완성도 높은 기능을 만들 수 있음을 확인했습니다.
'Project > mate' 카테고리의 다른 글
| [Mate] 개발일지 #20 - AWS CORS 해결 및 대댓글 시스템 구현 (0) | 2026.01.19 |
|---|---|
| [Mate] 개발일지 #19 - 메인 페이지 로딩 속도 개선 및 인터랙션 반응성 최적화 (0) | 2026.01.18 |
| [Mate] 개발일지 #18 - WebAuthn 기기 잠금 미설정 예외 처리 및 UX 개선 (0) | 2026.01.17 |
| [Mate] 개발일지 #17 - AWS Serverless 백엔드 안정화 및 테스트 데이터 구축 (1) | 2026.01.16 |
| [Mate] 개발일지 #16(2) - AWS Lambda Docker 배포 및 API Gateway 연동 트러블슈팅 (1) | 2026.01.16 |
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!