웹 소켓(WebSocket) 이해

설명

웹 소켓(WebSocket)은 클라이언트와 서버 간의 양방향(Full-Duplex) 통신을 가능하게 하는 프로토콜입니다. HTTP 기반의 요청-응답 방식과 달리, 한 번 연결되면 클라이언트와 서버가 실시간으로 데이터를 주고받을 수 있는 지속적인 연결을 유지합니다.

---

웹 소켓의 특징

1. 풀 듀플렉스(Full-Duplex) 통신

• 클라이언트와 서버가 동시에 데이터를 주고받을 수 있음
• HTTP는 클라이언트가 요청하면 서버가 응답하는 단방향 구조지만, WebSocket은 서버가 클라이언트에게 실시간으로 데이터를 보낼 수 있음

2. 연결 유지(Persistent Connection)

• HTTP는 요청마다 새로운 연결을 생성하지만, WebSocket은 연결을 유지하면서 데이터를 주고받음
• 이를 통해 지연시간(Latency)을 줄이고, 네트워크 비용을 절감할 수 있음

3. 낮은 오버헤드(Overhead)

• HTTP의 헤더는 기본적으로 수십~수백 바이트 이상이지만, WebSocket은 헤더 크기가 작아 데이터 전송 비용이 낮음

4. 서버 푸시(Server Push) 가능

• 서버가 클라이언트 요청 없이도 자동으로 데이터 전송 가능

---

웹 소켓 작동 방식

1. 핸드셰이크(Handshake) 과정

• 처음에는 HTTP 프로토콜을 사용하여 WebSocket 연결을 요청 (Upgrade 헤더 포함)
• 서버가 WebSocket 프로토콜 업그레이드를 승인하면 지속적인 연결이 유지됨

// 요청
GET /chat HTTP/1.1
Host: example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: x3JJHMbDL1EzLkh9YZrd9w==
Sec-WebSocket-Version: 13

// 응답
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: HSmrc0sMlYUkAGmm5OPpG2HaGWk=

2. 메시지 송수신

• 연결이 유지되는 동안 클라이언트와 서버는 텍스트 또는 바이너리 데이터를 주고받을 수 있음
• WebSocket 프레임을 사용하여 데이터 전송

3. 연결 종료

• 클라이언트나 서버가 연결을 닫으면 WebSocket 연결 종료
• 예제 코드: socket.close()

---

WebSocket의 단점 및 고려할 점

1. 방화벽(Firewall) 문제

• 일부 네트워크 환경(회사, 공공기관)에서는 WebSocket이 차단될 수 있음
• 대체 기술(WebRTC, SSE 등)과 함께 고려 필요

2. 서버 리소스 관리

• 연결을 계속 유지하므로 메모리 및 CPU 사용량 고려 필요
• 서버에서 일정 시간이 지나면 연결을 종료하는 방식 필요

3. 보안 문제

• 반드시 wss:// (WebSocket Secure) 사용 권장
• 클라이언트-서버 간 암호화(TLS) 적용 필요

---

브라우저의 웹소켓 관리 메커니즘

1. 연결 과정

• 소켓 생성: 브라우저는 new WebSocket() 호출을 받으면 네트워크 스택에 TCP 소켓을 생성합니다.
• HTTP 업그레이드: 브라우저는 Upgrade: websocket 헤더를 포함 HTTP 요청을 통해 웹소켓으로의 전환을 요청합니다.
• 보안 컨텍스트: 브라우저는 동일 출처 정책(Same-Origin Policy)과 CORS 제한을 적용하여 웹소켓 연결을 보호합니다.

2. 이벤트 처리

• 브라우저의 이벤트 루프는 웹소켓 이벤트(메시지 수신, 연결 종료 등)를 다른 JavaScript 이벤트와 함께 처리합니다.

3. 프레임 관리

※ 웹소켓 프레임: 가장 작은 단위의 데이터 패킷입니다. 모든 웹소켓 통신은 이러한 프레임들로 구성됩니다.

• 프레임 파싱: 브라우저는 수신된 바이너리 데이터를 웹소켓 프로토콜에 따라 프레임으로 파싱합니다.
• 마스킹: 클라이언트에서 서버로 보내는 모든 프레임은 브라우저에 의해 자동으로 마스킹 처리됩니다(보안상 이유).
• 조각화: 큰 메시지는 브라우저에 의해 여러 개의 작은 프레임으로 나뉘어 전송됩니다.

4. 연결 상태 관리

• 브라우저는 각 웹소켓 인스턴스의 상태(CONNECTING, OPEN, CLOSING, CLOSED)를 추적합니다.
• 네트워크 상태 변화(오프라인/온라인)에 따른 웹소켓 연결 관리도 담당
• 브라우저는 연결 상태를 확인하기 위해 서버와의 핑/퐁 메시지를 자동으로 관리
• 브라우저 탭이 비활성 상태일 때도 웹소켓 연결을 유지합니다.
• 사용자가 페이지를 새로고침하거나 탭을 닫으면 브라우저는 정상적으로 연결 종료를 시도합니다.

5. 리소스 관리

• 브라우저는 동시 웹소켓 연결 수를 제한합니다(브라우저마다 다름).
• 메모리 사용량이 높아지면 유휴 연결을 닫는 등의 최적화를 수행할 수 있습니다.