[MSW] MSW v2가 WebSocket을 막을 때 — SockJS 폴백으로 우회한 방법
·
Dev Notes/Frontend
1. 들어가며프론트엔드 개발 환경에서 MSW(Mock Service Worker)는 API 목 처리에 있어 거의 표준에 가까운 도구가 되었습니다. REST 요청을 인터셉트하고 가짜 응답을 내려주는 역할을 깔끔하게 수행해 줍니다.그런데 MSW v2부터 WebSocket 인터셉트 기능이 추가되면서 예상치 못한 문제와 마주쳤습니다. 실제 백엔드 WebSocket 서버에 연결해야 하는 상황인데, MSW가 포트와 URL을 가리지 않고 브라우저의 모든 WebSocket 연결을 가로채 버린 것입니다.이 글은 그 문제를 해결하기 위해 시도했던 방법들과 최종적으로 SockJS의 특성을 이용해 우회한 과정을 공유합니다.2. 문제 상황: MSW v2의 WebSocket 전면 인터셉트프로젝트는 호가창(주문서) 데이터를 STO..
[Project] AssetMind — 금융자산관리 웹 서비스 UI/UX 개발 및 실시간 데이터 처리
·
Projects/Frontend
Projects · 웹 프론트엔드 웹 프론트엔드 AssetMind진행 중 Figma 디자인부터 디자인 시스템 구축, 실서비스 API 연동까지UI 개발을 전담한 금융자산관리 웹 서비스 React TypeScript Tailwind CSS Storybook Zustand React Query WebSocket (STOMP) MSW Vite Figma Vercel Overview Period 2026.01 – 2026.06 (진행 중) Team 4인 팀 프로젝트 (UI · UX · 백엔드 · 데이터) Platform Web — PC / Tablet..