RabbitMQ를 활용하여 만들어본 간단한 채팅 사이트이다. 로그인 없이 자유롭게 채팅을 이용하는 사이트를 주제로 제작을 해보았었다. 사실 10월 말에 마무리했던 프로젝트였는데 지금 회고록을 작성하게 되었다... 아직 문제점이 있지만 현재는 잘 작동하고 있으므로 만족하고 있다.
기술 스택
- Springboot
- VueJS
- Spring Data JPA
- MySQL
- Nginx
- RabbitMQ
- Stomp
- Docker
화면 구성
회고록
RabbitMQ를 도커에 올려주고 스프링부트와 연결하여 사용하였다. 간단한 사이트 구조는 채팅방 생성, 입장, 삭제, 입장 시 닉네임 입력, 채팅 입력, 나가기가 있다. 생성 시 에는 생성 비밀번호를 작성해 방을 삭제할 수 있고 입장 비밀번호를 추가로 작성해 비밀 방을 만들 수 도 있다. 이번 프로젝트를 진행하면서 프론트 단과 백엔드 단 모두 고생을 많이 했었다.
우선 프론트는 이전에 사용해본 Vue를 사용했었는데 Stomp를 이용하는 로직과 방 이동을 위한 라우터를 처음 만들어 보았다. 처음 방 입장 시 서버와 소켓을 연결하고 방 ID로 구독을 해주었다. 입장 시 입장 대상자를 해당 방을 구독 중인 프론트로 모두 보내주어 입장 메세지를 띄어준다. 퇴장 시에도 마찬가지이다. 즉 입장과 퇴장은 프론트 단에서 감지하여 구독과 해제 진행 시 메세지를 보내주게 된다.
백엔드에서는 프론트 단의 구독과 해제를 캐치하여 로직을 진행하였다. 이 때 StompConfig에 세션과 방 ID를 저장하는 Map, Service에 방 ID와 인원 수를 저장하는 Map을 사용하게 된다. 구독을 캐치하면 해당 세션과 방 ID를 저장하고 Service에 해당 방의 인원 수를 +1 해주어 저장한 뒤 해당 방 인원 수를 소켓으로 구독 중인 프론트에 보내주어 프론트 단에서 인원 수를 갱신하도록 해주었다. 즉 방 입장 시 입장 대상자와 인원 수, 2개의 메세지를 보내주게 된다. 퇴장 시 해당 세션을 Map에서 제거해주고 방 인원 수를 -1 해준 뒤 인원 수를 메세지로 보내준다. 퇴장 시에도 퇴장 시에도 대상자와 인원 수를 메세지로 보내주게 된다.
프로젝트를 진행하면서 여러 문제를 직면을 했었다. 우선 프론트에서 heartbeat를 통해 백엔드와의 연결을 확인하는데 만약 다른 탭을 보고 있다면 서버에서 답을 해주지 않았다.... 그렇기에 연결이 끊기게 되고 이를 사용자는 알 수가 없었다. 우선 연결이 끊겼을 경우를 알려주기 위해 조건문을 사용해 끊겼을 경우 보이도록 해주었다.
그 후 서버에서 해제를 캐치해 카운트를 낮춰주고 메세지를 보내주게 된다. 연결이 끊기는 문제를 해결하기 위해 Stomp 버전도 바꿔보는 등 여러 방식을 사용해보았지만 잘 안되었다. 지금은 아래 방식을 사용하고 있다.
이 코드는 클라이언트에서 1분마다 heartbeat를 보내고 서버로부터 heartbeat를 받길 원하지 않는다는 내용인데 이럼에도 5번의 heartbeat, 즉 5분 뒤면 연결이 끊기게 된다. 서버 쪽 Stomp heartbeat 설정도 만져보았지만 똑같았었기에 아마 RabbitMQ 자체 문제인 것으로 예상이 된다. 이 외에도 StompConfig에서 해당 세션의 접속 정보를 알기 위해 사용하는 Map과 ChatService에서 해당 방의 인원 수를 알기 위해 사용하는 Map의 사용 또한 좋지 못한 방식인 것 같다. StompConfig에서 인원 수 조절을 위해 ChatService를 사용하는데 임시적으로 @Lazy를 이용해주고 있지만 후에 바꿔야 할 것 같다.
확실히 프론트 쪽 지식과 RabbitMQ api 관련 지식의 부족으로 인한 의문점들이 많았던 것 같다. 다른 탭 이동 시 5분 뒤에 연결이 끊긴다는 점을 제외하면 채팅 사이트로써의 구현은 성공했으므로 프로젝트를 마무리를 했다. 후에 개선할 점이라면 연결 끊김 부분과 세션 구독 정보, 인원 수 관리를 위한 Map 사용을 Redis라든가 다른 방식으로 변경하는 부분이지 않을까 싶다. Stomp 정말 어려웠다..
주소
소스 코드는 깃허브에 모두 올려두었다.
