LiveKit 로컬 다중 접속 테스트 환경 구축
LiveKit 로컬 다중 접속 테스트 환경 구축
- 문제 (Problem) 로컬 테스트 제약: 백엔드 인증 없이 프론트엔드 단독으로 화상 회의 기능을 테스트하기 어려움. 세션 충돌: 브라우저 탭을 여러 개 띄우면 localStorage의 User ID가 공유되어, LiveKit 서버가 “중복 접속”으로 판단해 기존 연결을 끊어버림.
- 해결 (Solution) “가상 신분 위조” 시스템 구축
URL로 신분 세탁: vue-router 쿼리를 활용해 접속할 때마다 다른 ID를 부여하도록 수정. http://localhost:5173/room/123 (기존 ID 사용) http://localhost:5173/room/123?userId=userA (userA로 접속) 자급자족 토큰 생성 (
LocalTokenGenerator ): 백엔드 API 호출 대신, 프론트엔드에서 직접 테스트용 JWT 토큰을 발급하는 유틸리티 구현. token 인자가 없으면 자동으로 로컬 생성 토큰을 사용하도록
RoomManager 로직 개선.
- 결과 (Result) Backend-Free: 서버 상태와 무관하게 언제든 화상 기능 개발 가능. 멀티 태스킹: 크롬 탭 4개를 띄워 혼자서 4인 팟 스터디룸 시나리오 완벽 검증 가능. DX(개발자 경험) 향상: 테스트를 위해 매번 다른 계정으로 로그아웃/로그인을 반복할 필요 없이, URL만 변경하여 즉시 멀티 유저 테스트 가능