WebSockets | Minstudio

WebSocket: 양방향 실시간 통신

WebSocket은 클라이언트와 서버 간에 지속적이고 완전한 양방향(Full-Duplex) 통신 채널을 제공하는 프로토콜입니다. 기존의 HTTP 요청과 달리, 한 번 연결이 수립되면 어느 쪽에서든 자유롭게 데이터를 실시간으로 주고받을 수 있습니다. 채팅 앱, 실시간 주식 데이터 갱신, 멀티플레이어 게임 등에 필수적인 기술입니다.

[그림 1] Handshake 이후 형성된 실시간 양방향 통신 터널 (WebSocket 구조)

1. HTTP 방식과 WebSocket 비교

HTTP Polling(주기적 요청)과 WebSocket 통신 방식을 비교한 다이어그램입니다.

2. WebSocket 라이프사이클 이벤트 (Events)

서버와의 연결 상태가 변하거나 데이터가 도착할 때 발생하는 이벤트들입니다.

이벤트명	발생 시점 및 설명
`open` (onopen)	서버와의 핸드셰이크가 성공하여 데이터 송수신 준비가 완료되었을 때 발생합니다.
`message` (onmessage)	서버로부터 데이터를 수신했을 때 발생합니다. `event.data` 속성을 통해 메시지를 읽을 수 있습니다.
`error` (onerror)	통신 중 에러가 발생했을 때 호출됩니다.
`close` (onclose)	서버와의 연결이 종료되었을 때 발생합니다. 서버 다운, 네트워크 단절, 명시적 close 호출 시 발동됩니다.

3. 제어 메서드 (Methods)

메서드명	설명
`send(data)`	서버로 데이터를 전송합니다. 문자열뿐만 아니라 Blob, ArrayBuffer 등의 바이너리 데이터도 보낼 수 있습니다.
`close([code, reason])`	웹소켓 연결을 명시적으로 종료합니다. 선택적으로 상태 코드와 종료 사유를 전달할 수 있습니다.

4. 상태 속성 (Properties)

속성명	설명
`readyState`	현재 연결 상태를 나타내는 숫자값입니다. (0: CONNECTING, 1: OPEN, 2: CLOSING, 3: CLOSED)
`bufferedAmount`	`send()`를 통해 큐에 등록되었지만 네트워크를 통해 아직 전송되지 않은 데이터의 바이트 크기를 반환합니다.
`url`	인스턴스가 연결된 절대 URL을 반환합니다.