Fundamentals 29 min read

Unveiling TCP/IP: From Handshakes to WebSocket – A Deep Dive

This article explores TCP/IP fundamentals—including three‑way handshake, receive windows, congestion control mechanisms, and HTTP header limits—while demonstrating practical packet captures with tcpdump and building a simple WebSocket chat demo to illustrate protocol behavior and differences from WebRTC.

21CTO
21CTO
21CTO
Unveiling TCP/IP: From Handshakes to WebSocket – A Deep Dive

Introduction

We use tcpdump to study TCP/IP characteristics and then build a small WebSocket demo to observe the protocol in action.

tcpdump Command

Capture packets on port 8080: sudo tcpdump port 8080 -n Show more details: sudo tcpdump port 8080 -n -v Capture traffic from a specific source or destination IP:

sudo tcpdump src host 10.2.200.11 or dst host 10.2.200.11

HTTP Connection Demo

Create a simple HTML file (shown in the original image) and run a Node http-server listening on port 8080. Use tcpdump to capture the packets while accessing the page from a mobile device.

Complete HTTP Handshake

The three‑way TCP handshake is captured as three packets:

Client sends SYN (seq 2153742604, MSS 1460, window scale 5).

Server replies with SYN‑ACK (seq 1007874094, ack 2153742605).

Client sends ACK (ack 1, window 4117 × 2⁵ = 131 KB).

The receive window is advertised using the wscale option because the original 16‑bit field can only represent up to 65 535 bytes.

Data Transfer

After the handshake, the client sends an HTTP GET request with the PUSH flag, followed by the server’s ACK and HTTP 200 OK response. The total payload size is 457 bytes, of which 289 bytes belong to the HTTP header.

Connection Termination

Four‑step termination (FIN‑ACK‑FIN‑ACK) occurs after a 30‑second idle period caused by the HTTP Connection: keep‑alive header.

Why Three‑Way Handshake?

Three exchanges guarantee that both sides have synchronized sequence numbers and can agree on initial parameters; two would not provide confirmation of the server’s ability to receive data.

Why Four‑Way Teardown?

The first two steps place the connection in a half‑closed state, allowing the side that initiated the close to stop sending data while the other side can still transmit any remaining data.

Four‑Layer Network Model

From the application layer down to the physical layer, data is encapsulated step by step. The article illustrates this with diagrams of HTTP request framing and explains the role of IP (routing) and TCP (port‑based delivery).

Physical Address & ARP

Each NIC has a unique MAC address. When a host needs the MAC of an IP on the same LAN, it broadcasts an ARP request and receives a reply.

Traceroute & Ping

traceroute

sends packets with increasing TTL to discover each hop. ping measures round‑trip time (RTT) and can infer the operating system from the default TTL (Linux 64, Windows 128, etc.).

Reset Packets

If the server process is stopped, a SYN is answered with an RST, indicating the port is closed.

Congestion Control

Receive Window vs. Congestion Window

The sending window is min(cwnd, rwnd). When cwnd exceeds rwnd, the receiver limits the rate; when rwnd exceeds cwnd, the sender’s network condition limits the rate.

Slow Start & Congestion Avoidance

Initially cwnd grows exponentially (slow start) until it reaches ssthresh, then grows linearly (congestion avoidance).

Timeout Retransmission

If an ACK is not received within the retransmission timer, the segment is resent and cwnd is reset to 1, re‑entering slow start.

Fast Retransmit & Fast Recovery

Three duplicate ACKs trigger fast retransmit without waiting for a timeout. Fast recovery sets cwnd = cwnd/2 + 3 and ssthresh = cwnd/2, then proceeds to congestion avoidance.

Nagle Algorithm

Nagle batches small segments to improve efficiency; it can be disabled with TCP_NODELAY for low‑latency applications.

HTTP Header Limits

Request header size: implementations vary (e.g., Nginx 4‑8 KB, Tomcat ≥ 8 KB).

URL length: no standard limit, but practical limits are around 8 KB.

Cookie size: typically ≤ 4 KB per domain, ≤ 50 cookies.

WebSocket Demo

Install the ws Node package, listen on port 8080, and use the following client code:

var socket = new WebSocket("ws://10.2.200.140:8080");
socket.onopen = function(){
    socket.send("长江长江,我是黄河");
};
socket.onmessage = function(event){
    document.write("收到来自黄河的消息:" + event.data);
};

Opening the page establishes a WebSocket connection, which is then examined with tcpdump.

WebSocket Handshake

The client sends an HTTP GET request with Upgrade: websocket. The server replies with 101 Switching Protocols, completing the upgrade.

Data Transfer

Sending the string "hello, world" (12 bytes) requires only 18 bytes over WebSocket, far less than the ~300 bytes of a comparable HTTP request.

Connection Close

After 30 seconds of inactivity, both sides close the connection with a four‑step TCP teardown.

WebSocket vs. WebRTC

WebSocket provides a persistent, low‑latency channel for arbitrary data but does not guarantee delivery quality. WebRTC is designed for reliable, high‑quality media streams and can establish peer‑to‑peer connections without a server relay.

Conclusion

The article covered TCP/IP core concepts—handshake, termination, congestion control, and related tools—then tied them together with a practical WebSocket demo, giving readers insight into what happens behind the scenes of network requests.

Original link: http://www.renfed.com/2017/05/20/websocket-and-tcp-ip/
Original Source

Signed-in readers can open the original source through BestHub's protected redirect.

Sign in to view source
Republication Notice

This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactadmin@besthub.devand we will review it promptly.

WebSocketHTTPTCP/IPNetwork Protocolscongestion control
21CTO
Written by

21CTO

21CTO (21CTO.com) offers developers community, training, and services, making it your go‑to learning and service platform.

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.