웹소켓 | Socket.io

taeyooooon·2023년 4월 21일
0
post-thumbnail

1. 웹소켓 이란?

웹소켓은 클라이언트와 서버 간의 실시간 양방향 통신을 가능하게 하는 프로토콜이다.
HTTP와 달리 웹소켓은 한번 연결이 되면, 연결이 닫히기 전 까지 지속적으로 클라이언트와 서버 양방향으로 자유롭게 데이터를 보낼 수 있다. 이를 통해, 실시간으로 데이터를 전송하고 받는 데 최적화된 웹을 개발할 수 있다. ex) 실시간 채팅, 주식거래

2. 웹소켓 작동원리

  1. 핸드쉐이크 :
    최초 연결 요청 시 클라이언트에서 HTTP를 통해 핸드쉐이크를 서버에 요청한다. 핸드쉐이크가 성공하면, 둘간의 통신 프로토콜은 웹소켓 으로 전환된다.

  2. 통신 :
    연결이 되면 클라이언트와 서버 양측간의 데이터 통신 단계가 시작된다. 양방향으로 메세지를 보내며 통신하는데, 이 메세지는 프레임(Frame) 단위로 이루어진다.
    또한, 연결 이후에는 서버와 클라이언트는 언제든 상대방에게 ping 패킷을 보낼 수 있다. Ping 을 수신한 측은 가능한 빨리 pong 패킷을 상대방에게 전송해야한다. 이런 방식으로 서로의 연결이 살아있는지를 주기적으로 확인할 수 있는데, 이를 Heartbeat 라고 한다.

  3. 연결종료 :
    클라이언트 혹은 서버 양측 누구나 연결을 종료할 수 있다. 연결 종료를 원하는 측이 Close Frame 을 상대쪽으로 전송하면 된다.

3. Socket.io란

Socket.io는 실시간 통신을 제공하는 자바스크립트 프레임워크이다.
공식문서에서는 Socket.io를 아래처럼 소개하고있다.

Socket.IO is a library that enables low-latency, bidirectional and event-based communication between a client and a server.

얼핏보면 웹소켓과 다를게 없어보이지만
웹소켓을 제공하지 않는 브라우저의 경우 HTTP long-polling으로의 fallback 을 제공해주고
자동 재접속 등의 부가기능을 제공해준다.

참고 https://socket.io/docs/v4/#what-socketio-is

참고한 글

https://socket.io/
https://hudi.blog/websocket-with-nodejs/

profile
응애🐣 프론트엔드

0개의 댓글