Closed cotchan closed 2 years ago
예상 기능
채팅방
nested array
채팅 메시지
$slice
채팅 메시지를 10개씩만 가져오도록
{ "_id": {}, "product_id": 3, "product_image": "c14sdf2d-0c8c-44fb-a87e-8a7afe4fbb27product1.jpg", "first_user_id": 3, "second_user_id": 6, "identifier": "1-6", "chat_messages": [ { "senderId": 1, "messageType": 1, "message": "테스트 메시지 입니다", "createdAt": 1656320454630 }, { "senderId": 6, "messageType": 3, "imgUrls": [ "c16de0a7-0c8c-44fb-a87e-8a7afe4fbb27test1.jpg", "fc0a2cf6-2c88-4fae-bf1b-0f96481606dftest2.png", "6b06d600-52a8-40f1-a328-4f6cb3df615dtest3.jpg", "3d6e58d2-ff68-40e0-81f0-c5df4c2aeb37하이.jpg", "21debba4-d5a5-4f4a-a9a9-4c17bbab4ce5바이.png" ], "createdAt": 1656319631641 }, { "senderId": 1, "messageType": 2, "message": "123,456", "createdAt": 1656321431112 } ], "created_at": 1656319631641, "updated_at": 1656321433608 }
참여자
현재 읽지 않은 메시지 갯수
{ "_id": {}, "user_id": 3, "chat_room_id": "62b96d2844b3907e8fb28a2d", "read_message_size": 10, "out": false, "created_at": 1656319272618, "updated_at": 1656321433608 }
spring-boot-starter-websocket
Spring Data Mongo
STOMP
또한 아래 링크를 참고하여 React의 SockJsClient를 사용해서 React와 연동할 수 있는 방법 리서치
SockJsClient
그래서 chat-server에 WebSocketConfig, MessageSender를 정의하고 Spring Data Mongo를 사용하여 '채팅방 메시지 보내기/받기' 기능 완성
chat-server
@Configuration @EnableWebSocketMessageBroker public class WebSocketConfig implements WebSocketMessageBrokerConfigurer { @Override public void registerStompEndpoints(StompEndpointRegistry registry) { registry.addEndpoint("/ws-chat") .setAllowedOrigins("http://localhost:3000") .withSockJS(); } @Override public void configureMessageBroker(MessageBrokerRegistry registry) { registry.setApplicationDestinationPrefixes("/app"); registry.enableSimpleBroker("/topic"); } }
@Slf4j @Service @RequiredArgsConstructor public class MessageSender { private final SimpMessagingTemplate template; public void send(CreateRequest message) { try { template.convertAndSend("/topic/chat/" + message.getRoomId(), message); } catch (MessagingException e) { log.warn("MessageSender send error occurred with roomId: {}", message.getRoomId(), e); } } }
해당 이슈는 아래에 정리하였습니다 :)
채팅 API 개발
목차
이슈1: 채팅 DB 설계
예상 기능
의 요구사항을 충족하면서 nosql의 이점을 살릴 수 있도록 설계하는 방법 고려chat_rooms 도메인
채팅방
을 나타내는 도메인nested array
를 사용하여 특정 채팅방 내에 있는채팅 메시지
를 관리하도록 하였음$slice
연산을 적용하여 채팅방 내채팅 메시지를 10개씩만 가져오도록
처리participants 도메인
참여자
를 나타내는 도메인참여자
도메인이 필요한 이유현재 읽지 않은 메시지 갯수
이슈2: 채팅방 메시지 보내기/받기
spring-boot-starter-websocket
+Spring Data Mongo
로 구현STOMP
를 편리하게 사용할 수 있는spring-boot-starter-websocket
라이브러리 존재. 하지만 해당 라이브러리만 사용하면 반대편 클라이언트가 웹 소켓과 커넥션을 맺고 있을 때만 메시지 전파 가능또한 아래 링크를 참고하여 React의
SockJsClient
를 사용해서 React와 연동할 수 있는 방법 리서치그래서
chat-server
에 WebSocketConfig, MessageSender를 정의하고 Spring Data Mongo를 사용하여 '채팅방 메시지 보내기/받기' 기능 완성WebSocketConfig
MessageSender
이슈3: 채팅메시지로 이미지 보낼 수 있도록 하기
해당 이슈는 아래에 정리하였습니다 :)
78