오늘은 할래? 프로젝트에 구현할 채팅방 생성에 대해 다뤄보려고 한다.
WEBSOCKET, SOCKJS, STOMP 를 활용해 실시간 채팅이 이루어지게 적용한 상태 이고 이제 유저가 대화하게 될 장소 즉 방을 데이터베이스를 이용해 나누려고 한다.
https://velog.io/@oring7070/%EC%B1%84%ED%8C%85-%EA%B8%B0%EB%8A%A5-%EA%B5%AC%ED%98%84
위의 내용이 실시간 채팅을 구현한 내용이다.
채팅방 생성 Controller API
구현하고 있는 프로젝트의 구성상 사용자가 게시물을 생성했을때 채팅방이 생성되는 구조이다.
위의 Controller 에선 게시물의 id 값과 토큰에 저장된 유저 정보를 채팅방 생성 메소드에 인자로 보내준다.
채팅방 생성 Service
앞서 구현한 Controller 에서 받은 게시글 id를 이용해 해당 게시물 데이터를 가져오고, 가져온 데이터를 활용해 채팅방 제목에 쓸 chatTitle 과 함께 채팅방 데이터를 생성 후 chatRoom 이란 채팅방 정보를 저장하는 테이블에 저장한다.
그 다음으로 현재 로그인한 사용자의 데이터를 받아와 user 객체를 생성 후 userChatRoom 이란 채팅방에 속한 사용자들을 저장하는 테이블에 데이터를 저장한다.
chatRoom 은 /Topic/ + roomNumber 에서 방을 구분하는 roomNumber에 id를 활용할 예정이고, userChatRoom 은 해당하는 채팅방에 속한 사용자가 어떤 사용자가 있는지를 저장할 용도이다.
chatRoom
userChatRoom
사용자가 게시물을 생성했을 때 저장될 채팅방 테이블과 사용자 테이블의 형태이다.
위와 같은 STOMP Controller를 보면 /chat/send 로 지정된 곳에 메세지를 보내는데 메세지 데이터중 roomNumber 데이터를 함께 받아와 어떤 채팅방에서 데이터가 들어왔는지 판단하고 /topic/roomNumber 로 지정된 채팅방에 메세지가 전달되도록 한다.
여기서 roomNumber에 사용되는 데이터가 앞서 생성한 chatRoom(채팅방 데이터)의 id 값이다.
위와같은 형식으로 채팅방을 나누고 각각의 채팅방에서만 데이터를 송수신 하도록 한다.
채팅방 사용자 조회 Controller api
다음으로 위와같이 채팅방 id 를 이용해 userChatRoom(채팅방에 속한 사용자 테이블)에서 해당 채팅방에 속한 사용자를 조회하는 api를 구현한다.
채팅방 사용자 조회 Service
Controller 에서 받아온 채팅방 id 값으로 chatRoom(채팅방 데이터) 을 조회해 해당 채팅방이 존재하는지 확인하고, userChatRoom(채팅방에 속한 사용자 테이블) 에서 id값에 해당하는 채팅방 데이터를 가진 사용자들의 데이터를 생성해 반환한다.
위와 같은 데이터를 반환하게 되는데 title4 란 채팅방에 testid 란 유저가 존재하는걸 알 수 있다.
JS
클라이언트에서 ajax를 활용해 로그인한 유저의 데이터가 채팅방에 속한 사용자인지 for문을 통해 확인하고 속한 사용자가 아닐경우 메인 페이지로 전환되게 한다.
마무리
이렇듯 테이블을 활용해 채팅방과 유저들을 나누는 방법이 확실히 맞는지는 모르겠으나 현재 알고있는 지식으로 구현해본 채팅방 구현이다.
추후 채팅방에서 이루어지는 채팅들을 저장하고 채팅방에서 사용자를 강퇴하거나 사용자 스스로 나가는 등의 기능들로 채팅기능의 디테일을 살리려고 한다.
또한 채팅방이 삭제되거나 사용자가 한명일때 연결된 소켓을 닫거나 자원을 해제하는 등의 시도를 해볼 예정이다.
