프로젝트에서 실시간 기능을 구현해야 하는 일이 생겼는데
학원에서 배운적이 없어 독학을 해보려고 한다.
원래는 nodejs를 통해서 Socketio를 독학했었는데, Spring 백엔드와 연동하는게 생각보다 복잡하고 어려워서 SpringBoot기반으로 다시 학습을 진행해보려고 한다.
실시간 연결: Websocket, SockJS(Websocket의 한계를 극복)
실시간 메세지 주고 받기: STOMP
미디어 스트리밍 기술: WebRTC
WebRTC를 지원하는 JavaScript 라이브러리 : PeerJS(P2P일때만 사용)
WebRTC를 지원하는 SpringBoot 라이브러리 : Kurento(적합)
결과적으로 WebSocketHandler를 구현해서 연결을 시켜야 한다.
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency>
- 인터페이스 구현 예시
@Configuration @EnableWebSocket public class WebSocketConfig implements WebSocketConfigurer { @Override public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) { registry.addHandler(myHandler(), "/my-handler"); } @Bean public WebSocketHandler myHandler() { return new MyHandler(); } }
- 핸들러 예시
public class MyHandler implements WebSocketHandler { @Override public void afterConnectionEstablished(WebSocketSession session) throws Exception { // 클라이언트와 연결이 성공적으로 이루어지면 호출되는 메서드 } @Override public void handleMessage(WebSocketSession session, WebSocketMessage<?> message) throws Exception { // 클라이언트로부터 메시지가 도착하면 호출되는 메서드 } @Override public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception { // 에러가 발생하면 호출되는 메서드 } @Override public void afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus) throws Exception { // 클라이언트와 연결이 종료되면 호출되는 메서드 } @Override public boolean supportsPartialMessages() { return false; } }
- 클라이언트 예시
var socket = new WebSocket("ws://localhost:8080/my-handler"); socket.onopen = function() { console.log("WebSocket 연결이 열렸습니다."); }; socket.on
- Websocket에서 수신된 메세지를 처리함
socket.onmessage = function(event) { console.log("서버에서 메시지를 수신했습니다: " + event.data); };
🌼WebSocketConfigurer 인터페이스
WebSocket을 구성하는 방법을 정의하는 인터페이스
@EnableWebSocket:
Spring Framework에서 WebSocket을 사용하기 위해 설정 클래스에 지정하는 어노테이션
메소드:
configureWebSocketTransport(WebSocketHandlerRegistry registry)
파라미터 WebSocketHandlerRegistry: WebSocket 핸들러를 등록하게 해주는 클래스
.addHandler([WebSocketHandler 구현객체], [WebSocket을 받을 url]);
- url은 클라이언트가 WebSocket 연결을 요청할 때 사용될 URL과 일치
- WebSocketHandler 인터페이스를 구현한 객체는 Bean으로 등록되어 있어야 함
🌼 WebSocketHandler 구현한 핸들러
메소드
afterConnectionEstablished(WebSocketSession session)
-> 클라이언트와 연결이 성공적으로 이루어지면 호출되는 메서드handleMessage(WebSocketSession session, WebSocketMessage<?> message)
-> 클라이언트로부터 메시지가 도착하면 호출되는 메서드handleTransportError(WebSocketSession session, Throwable exception)
-> 에러가 발생하면 호출되는 메서드afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus)
-> 클라이언트와 연결이 종료되면 호출되는 메서드supportsPartialMessages()
-> boolean타입. 메세지의 길이가 긴 경우 수신을 처리할 수 있는지 없는지 판단하는 메소드🌼JavaScript 클라이언트
new WebSocket([통신주소])
-> 서버와의 연결을 열어줌.onopen
-> 연결이 됐을때 콜백함수 호출socket.on
-> WebSocket 객체에서 수신된 메시지를 처리하는 이벤트 핸들러 함수를 등록
-> 이벤트 핸들러 함수 등록 필수