💬

유저 간 실시간 채팅

Created

2023/11/27 01:51

담당자

섬네일

실시간으로 다수의 유저가 채팅에 참여할 수 있다채팅에 참여하는 유저들이 실시간으로 보여진다. 많은 데이터의 송수신이 이루어져야 한다.

•

BE

Web socket : 실시간 데이터 송수신을 위해 웹소켓을 활용했습니다. 커스텀 핸들러를 이용해 SUBSCRIBE, DISCONNECT 시 유저를 식별합니다.

Redis as Real-time data store : 인메모리 DB를 활용해 빠르게 채팅에 참여하는 유저를 저장하고 가져옵니다.

Redis as Streaming & messaging : 단일 큐로 동작하는 레디스 메세지 컨테이너를 활용하여 클라이언트간 채팅을 중개합니다. 다수간 채팅 서비스에 생길 수 있는 위험을 줄이고 안정성을 보완합니다.

STOMP : WebSocket에 대한 불필요한 구현을 줄여, 명확하고 쉽게 구현합니다.

•

FE

STOMP JS를 사용해 STOMP 연결, 구독, 발행 로직을 구현하였습니다.

메시지를 실시간으로 state에 저장하고 화면에 노출하는 방식으로, 별도의 API 요청 없이 채팅 메시지를 주고 받을 수 있습니다.

채팅방에서 호스트가 퇴장하면 채팅방 사라지고, 모든 유저들에게는 채팅방이 삭제되었다는 모달 알림창과 함께 채팅방 리스트로 이동됩니다.

채팅방의 호스트는 채팅방의 다른 유저에게 호스트를 위임함으로서 채팅방이 삭제되는 것을 방지할 수 있습니다.

현재 채팅방의 참여중인 유저의 수와 그 리스트가 실시간으로 반영되는 것을 조회할 수 있습니다.