Chapter 2

The HTTP Request Flow

Browser → DNS → TCP → TLS → server → response.

Learning objectives

Describe each step from URL click to HTML response
Distinguish TCP, TLS, and HTTP layers
Identify common status codes and headers

One click, many layers

When a customer visits https://www.workshopco.ca/classes, their browser performs a sequence of operations across DNS, TCP, TLS, and HTTP. Understanding the order helps you debug slow pages, certificate errors, and 404s.

DNS lookup — resolve www.workshopco.ca → 203.0.113.10
TCP handshake — connect to port 443 on that IP
TLS handshake — agree encryption, verify certificate
HTTP request — send method, path, headers
Server processing — Nginx routes to files or PHP-FPM
HTTP response — status, headers, body (HTML, CSS, JS)

HTTP request anatomy

After TLS is established, the browser sends a request like this:

GET /classes HTTP/1.1
Host: www.workshopco.ca
User-Agent: Mozilla/5.0 ...
Accept: text/html
Accept-Language: en-CA
Connection: keep-alive

Method (GET) says what to do. Path (/classes) is the resource. Host tells the server which virtual host — critical when one IP serves many domains.

HTTP response anatomy

Nginx replies with a status line, headers, and body:

HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
Content-Length: 4821
Strict-Transport-Security: max-age=31536000

<!DOCTYPE html>
<html>...</html>

Status	Meaning	Workshop Co. example
`200`	Success	Classes page loads normally
`301`	Permanent redirect	`workshopco.ca` → `www`
`404`	Not found	Typo in URL `/classses`
`500`	Server error	PHP fatal error in booking form

Keep-alive

Modern browsers reuse TCP connections for many requests (HTML, CSS, images). That is why one slow TLS handshake affects the first asset most — HTTP/2 and HTTP/3 improve this further, but the layered model stays the same.

Worked example — trace a redirect

Workshop Co. wants bare workshopco.ca to redirect to www. A visitor typing the apex gets:

HTTP/1.1 301 Moved Permanently
Location: https://www.workshopco.ca/
Content-Length: 0

The browser follows Location automatically and opens a new request to www. Search engines consolidate ranking signals on the canonical host.

Layer stack (simplified)

Application  │  HTTP (GET /classes)
             │  TLS  (encrypt + cert check)
Transport    │  TCP  (reliable connection, port 443)
Network      │  IP   (203.0.113.10)
             └──────────────────────────────

Try it yourself — read a response

From a terminal (or an online HTTP client), request https://www.workshopco.ca and write down the status code, Content-Type, and whether Strict-Transport-Security appears.

Answer

Expect 200 (or 301 if apex redirects). Content-Type should be text/html. HSTS header means the browser will force HTTPS on return visits — covered in the capstone.

Example command: curl -I https://example.com (swap in any HTTPS site while Workshop Co. staging is built).

Quick quiz

Which happens first — DNS lookup or TCP connection?
Why does the Host header matter on a shared server?
What status code means “permanent redirect”?

Answers

DNS lookup — you need the IP before opening TCP.
One IP may serve many domains; Nginx uses Host to pick the correct server block.
301 — use for canonical URL changes like apex → www.