Socket.io이란? 웹 소켓과의 차이점은?

개요

Socket.io는 무엇이고, 언제 사용할 수 있는지, 그리고 WebSocket과의 차이점을 알아보겠습니다.

본문

Socket.io이란?

Socket.io는 클라이언트와 서버 간의 짧은 지연 시간, 양방향, 이벤트 기반의 통신입니다. 때문에 실시간 서비스에서 사용하기에 적합한 라이브러리입니다. Socket.io는 HTTP와 다르게 연결만 되어 있다면 서버에서도 원할 때 요청을 먼저 줄 수 있습니다. 또 클라이언트와 연결이 비정상적으로 끊어졌을 때 자동으로 재연결을 시도하며, 패킷을 자동으로 버퍼에 저장하고, 재연결이 되면 이를 전송합니다.

 

주의 할 점은 Socket.io는 모바일 애플리케이션의 백그라운드 서비스에서 사용하기에 적합하지 않습니다. 서버와 개방형 TCP 연결을 유지하므로 배터리를 많이 소모할 수 있기 때문입니다. 때문에 이는 FCM 같은 메시지 전용 플랫폼 등의 사용을 고려해야 합니다.

Socket.io와 WebSocket과의 차이점은?

WebSocket은 HTML5의 표준으로 연결이 된다면 하나의 TCP 연결을 통해 서버와 클라이언트 간의 양방향 통신을 가능하게 합니다. HTTP 프로토콜 통신으로 시작하여 핸드셰이크 이후에 웹소켓 프로토콜로 업데이트됩니다. 소켓이 연결되고 나서는 HTTP 헤더가 필요 없으므로 데이터 오버헤드가 줄어드는 장점이 있습니다. Socket.io는 WebSockets의 구현체가 아니라 이를 사용하는 라이브러리입니다. Socket.io는 WebSocket의 기능을 모두 지원하고 여기에 추가적인 기능을 제공합니다. 추가적인 기능에는 Acknowledgements, broadcasting 그리고 reconnection 등이 있습니다.

참고로 Socket.io는 추가적인 데이터를 제공하기 때문에 WebSocket에 비해 오버헤드가 존재하는데 패킷 타입에 해당하는 문자 2 byte와 이벤트 형식에 사용될 데이터를 JSON.stringify()로 변환해 문자열로 갖고 있습니다.

 

Acknowledgements는 클라이언트와 서버 간의 이벤트가 성공적으로 수신 되었는지 확인하기 위해 사용됩니다. 요청과 응답의 형식은 다음과 같습니다.

Sender

socket.emit("hello", "world", (response) => {
  console.log(response); // "got it"
});

 

Receiver

socket.on("hello", (arg, callback) => {
  console.log(arg); // "world"
  callback("got it");
});

보내는 쪽은 emit()을 통해 이벤트를 발생 시킵니다. 받는 쪽은 on()으로 이벤트를 감지합니다. on()의 첫 번째 인자에 들어간 "hello"를 통해 이벤트를 감지하며 해당 이벤트 명으로 emit()을 실행하면 on()의 두 번째 인자로 들어간 콜백 함수(이벤트)가 실행됩니다.

 

Broadcastring도 가능하다.

// to all connected clients
io.emit("hello");

// to all connected clients in the "news" room
io.to("news").emit("hello");

위 코드와 같이 단순히 emit()을 하게 되면 연결된 모든 클라이언트에게 hello라는 내용의 문자열이 전송되며, 전체 공지 등과 같을 때 사용하게 될 것이다. 또 특정 집단에게만 보내고 싶다면 to()를 사용하면 된다. 예를 들면 특정 채팅방에 들어간 사람에게만 전하고 싶다면 to("특정 채팅방")으로 진행하면 된다.

 

 

 

 

 

 

 

 

 

 

 

 

 

https://socket.io/docs/v4/#acknowledgements