Fundamentals 16 min read

How Your Browser Connects: A Step-by-Step Guide to Networking Basics

This article walks through the complete process of how a browser accesses a web resource, from parsing a URL and generating an HTTP request, through DNS name resolution, the construction of MAC, IP, TCP, and application headers, to the TCP three‑way handshake, data transmission, and the four‑step connection termination.

JD Cloud Developers
JD Cloud Developers
JD Cloud Developers
How Your Browser Connects: A Step-by-Step Guide to Networking Basics

Browser Generates Message and Sends

When a user enters a URL such as https://www.jdl.cn/img/service.843585b7.png, the browser parses the URL into protocol (https), host (www.jdl.cn), directory (img) and file name (service.843585b7.png), then constructs an HTTP request message.

Generate HTTP Request Message

https : protocol used to access the data source.

www.jdl.cn : web server name.

img : directory name.

service.843585b7.png : file name.

DNS Domain Name Resolution to IP Address

After generating the HTTP message, the browser must resolve the domain name to an IP address. The resolution process checks the browser cache, the OS hosts file, then queries the local DNS server, which may forward the request up the DNS hierarchy.

Browser checks its cache for the domain.

Operating system checks the hosts file.

Operating system sends a query to the local DNS server.

Domain : server name.

Class : historically used to identify network types; today always IN (Internet).

Record Type : indicates the kind of DNS record (A, CNAME, MX, etc.).

A record maps a domain directly to an IP address.

CNAME record maps a domain to another domain.

MX record maps a domain to a mail server.

Domain Hierarchy

Higher levels are on the right; e.g., www.jdl.cn = cn → jdl → www.

Each level is registered in DNS servers, forming a hierarchical lookup.

Root DNS servers store pointers to top‑level domain servers (e.g., .com, .cn).

Only 13 root server IP addresses exist.

When the client contacts the nearest DNS server and the server lacks the record, the query is forwarded upward until the IP address is found.

Delegate to Protocol Stack to Send Message

With the IP address known, the operating system’s protocol stack sends the packet to the destination.

Applications such as browsers use TCP for data transmission.

Short control messages like DNS queries use UDP.

Network Layering

OSI Seven‑Layer Model

Open Systems Interconnection (OSI) model is a conceptual framework defined by ISO/IEC 7498‑1 that standardizes the functions of a telecommunication or computing system into seven abstraction layers.

TCP/IP Four‑Layer Model

Application layer: HTTP, DNS, FTP.

Transport layer: TCP, UDP.

Network layer: IP.

Network interface layer.

TCP/IP refers to the suite of protocols that includes FTP, SMTP, TCP, UDP, IP, etc., with TCP and IP being the most representative.

Client‑Server Data Transfer Process

Each layer adds its own header to the data packet.

The client continuously adds headers; the server removes them.

Three‑Way Handshake

To establish a TCP connection, the client and server perform a three‑way handshake (SYN, SYN‑ACK, ACK).

Client starts from CLOSED state and sends SYN.

Server replies with SYN‑ACK and enters SYN‑RCVD state.

Client sends ACK and both sides enter ESTABLISHED state.

After the three‑way handshake, the client and server can exchange data packets.

Application Layer

HTTP Packet Fragmentation

Typical HTTP request messages fit within a single network packet; if the payload exceeds the MSS, it is split into multiple packets.

MTU (Maximum Transmission Unit) is the maximum packet size (commonly 1500 bytes on Ethernet).

MSS (Maximum Segment Size) is the maximum TCP payload size after headers.

Transport Layer

TCP Segment Format

Source and destination ports (16 bits each).

Sequence number and acknowledgment number (32 bits each).

Header length, reserved bits, and control flags (URG, ACK, PSH, RST, SYN, FIN).

Window size, checksum, urgent pointer, and optional fields.

Sequence and acknowledgment numbers are the attributes referenced in the three‑way handshake.

Network Layer

IP Packet Format

Version, header length, TOS, total length, identification, flags, fragment offset, TTL, protocol (TCP=06, UDP=17, ICMP=01), header checksum, source and destination IP addresses, and optional fields.

MAC Packet

Destination MAC address (48 bits) and source MAC address (48 bits).

EtherType field (e.g., 0800 for IP, 0806 for ARP, 86DD for IPv6).

MAC Address vs IP Address

MAC addresses are used within the local Ethernet segment; IP addresses are used for routing across networks.

ARP resolves an IP address to a MAC address via broadcast.

ARP Broadcast

ARP (Address Resolution Protocol) maps an IP address to a MAC address.

Clients broadcast an ARP request; the device owning the IP replies with its MAC.

ARP caches reduce broadcast traffic; entries expire after a few minutes.

Static ARP entries are manually configured; dynamic entries expire automatically.

Overall Packet

The final packet consists of a MAC header, IP header, TCP header, and application data, respecting MTU and MSS limits as it traverses the network.

Connection Termination

Four‑Way Handshake

After data exchange, the TCP connection is closed using a four‑step termination process.

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.

HTTPTCP/IPNetworkingDNSOSI modelpacket structure
JD Cloud Developers
Written by

JD Cloud Developers

JD Cloud Developers (Developer of JD Technology) is a JD Technology Group platform offering technical sharing and communication for AI, cloud computing, IoT and related developers. It publishes JD product technical information, industry content, and tech event news. Embrace technology and partner with developers to envision the future.

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.