개발/Server

SSE (Server-Sent Events)

졔졔311 2023. 8. 9. 23:17
728x90
반응형

SSE란?

서버에서 클라이언트에 이벤트를 보내는 기술.

다른 프로토콜 필요 없이 http를 이용해 통신 가능.

 

WebSocket과의 차이점

websocket의 경우, 양방향 통신 방식이지만

sse는 단방향으로 클라이언트는 오로지 데이터를 받을 수만 있다. (straight forward)

따라서, sse의 장점은 배터리 소모량이 작다는 점을 들 수 있다.

 

SSE 구현 방법

sse를 구현하는 방법은 간단한데,

클라이언트에서 서버에 sse 연결(구독) 요청을 보낸 후,

서버에서는 이에 해당하는 sse 연결 객체를 생성하고,

이벤트 발생 시 서버에서 이 객체를 통해 클라이언트로 데이터를 전송한다.

여기서의 핵심은 content-type을 "text/event-stream"으로 설정하는 것이다.

 

Spring에서는 SseEmitter API를 통해 sse 연결을 지원한다.

import org.springframework.web.servlet.mvc.method.annotation.SseEmitter;  

 

React에서 client로서 데이터를 받을 경우,

javascript의 EventSource 객체를 사용하면 된다.

 

 

출처

https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events

https://hamait.tistory.com/792

https://surviveasdev.tistory.com/entry/%EC%9B%B9%EC%86%8C%EC%BC%93-%EA%B3%BC-SSEServer-Sent-Event-%EC%B0%A8%EC%9D%B4%EC%A0%90-%EC%95%8C%EC%95%84%EB%B3%B4%EA%B3%A0-%EC%82%AC%EC%9A%A9%ED%95%B4%EB%B3%B4%EA%B8%B0

서버 : https://tecoble.techcourse.co.kr/post/2022-10-11-server-sent-events/

클라이언트 : https://velog.io/@green9930/%EC%8B%A4%EC%A0%84-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-React%EC%99%80-SSE

728x90
반응형