SSE 통신(Server Sent Event)

일반적으로 클라이언트와 서버간의 통신은 클라이언트에서 서버에 정보를 호출하면 서버에서 클라이언트로 데이터를 전송하는 방식으로 사용됩니다.

 

SSE 통신은 클라이언트의 호출없이 서버에서 이벤트가 발생하면 서버에서 클라이언트로 정보를 전송하는 단방향통신입니다.

 

스프링을 기준으로 예제를 보여드리겠습니다.

 

SseController

package com.example.web.controller;

import com.example.web.domain.ProductVO;
import com.example.web.dto.ReceivedData;
import com.example.web.repository.RunStateRepository;
import com.example.web.service.CrawlerService;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.MediaType;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.servlet.mvc.method.annotation.SseEmitter;

import java.io.IOException;
import java.util.List;
import java.util.Objects;
import java.util.concurrent.CopyOnWriteArrayList;

@RestController
@Slf4j
public class SseController {

    private final CopyOnWriteArrayList<SseEmitter> emitters = new CopyOnWriteArrayList<>();

    @GetMapping("/sse")
    public SseEmitter handleSse() {
        SseEmitter emitter = new SseEmitter();
        emitters.add(emitter);

        emitter.onCompletion(() -> emitters.remove(emitter));
        emitter.onTimeout(() -> emitters.remove(emitter));

        return emitter;
    }

    public void sendData(String receivedData) { //이벤트 발생시 데이터 전송, Service에서 호출하면 데이터 전송가능
        emitters.forEach(emitter -> {
            try {
                emitter.send(SseEmitter.event().data(receivedData, MediaType.APPLICATION_JSON));
            } catch (IOException e) {
                emitter.completeWithError(e);
            }
        });
    }
}

 

클라이언트 자바스크립트

const eventSource = new EventSource("/sse");

eventSource.onmessage = event => {
    let json_data;
    try {
        json_data = JSON.parse(event.data);

 		console.log(json_data)
        }
    } catch (ex) {
        // JSON 파싱에 실패한 경우에 대한 처리
        console.error("JSON 파싱 오류:", ex);
    }
};
eventSource.onerror = function(error) {
    console.error("에러발생 : ", error);
};

 

주의할점은 SSE 통신은 Get방식으로만 받을 수 있으면 데이터를 전송할때는 문자열로 변환한다음 전송해야 합니다.