Internet và Web hoạt động thế nào: client, server, HTTP, DNS

Bản đồ công trìnhTờ này lắp: Giao diện app, API, Hosting & tên miền

Bài nàyĐã họcChưa tớiĐã thay thế

Bạn sẽ học được gì

Tiêu chí nghiệm thu

Phân biệt Internet và Web, client và server bằng ẩn dụ quầy order.
Đọc hiểu từng phần của một URL như https://oms.banhmoc.vn/don-hang/BM-261012-007.
Giải thích DNS và địa chỉ IP, và vì sao đổi tên miền “mất thời gian mới chạy”.
Theo dõi hành trình đầy đủ của một request từ trình duyệt tới server Mộc OMS và quay về.
Nhận diện các HTTP method và mã trạng thái thường gặp để khoanh vùng lỗi.
Hiểu HTTPS bảo vệ điều gì và điều gì nó không bảo vệ.

Internet và Web: đường sá và dịch vụ giao hàng

Hai từ này hay bị dùng lẫn, nhưng chúng khác nhau.

Internet là mạng lưới vật lý nối hàng tỷ thiết bị trên thế giới: cáp quang dưới biển, trạm phát sóng, bộ định tuyến (router) ở nhà bạn. Hãy hình dung nó như hệ thống đường sá: đường cao tốc, đường làng, ngã tư, cầu. Bản thân đường không biết trên đó chở gì.

Web (World Wide Web) là một dịch vụ chạy trên Internet, giống như dịch vụ giao hàng chạy trên đường sá. Web là thế giới của trang web, đường liên kết, trình duyệt. Nhưng trên cùng hệ thống đường đó còn có nhiều dịch vụ khác: email, cuộc gọi Zalo, game online, đồng bộ file. Chúng đều dùng Internet, nhưng không phải Web.

Vì sao phân biệt quan trọng? Vì khi Hà nói “mất mạng”, có thể là đường sá hỏng (Wi-Fi tiệm có vấn đề, không vào được trang nào) hoặc chỉ một “cửa hàng” đóng cửa (riêng Mộc OMS không vào được, Facebook vẫn bình thường). Hai tình huống này cần cách xử lý hoàn toàn khác.

Mô hình client – server: khách và quầy bếp

Gần như mọi ứng dụng web vận hành theo mô hình client – server (khách – chủ):

Client (máy khách) là bên hỏi. Trình duyệt Chrome trên điện thoại của Hà, app Zalo, thậm chí một chương trình tự động, đều có thể là client.
Server (máy chủ) là bên trả lời. Đó là một máy tính bật liên tục, chờ nhận yêu cầu, xử lý và gửi kết quả về.

Ẩn dụ tiệm bánh: client là khách đứng trước quầy order, server là quầy và bếp phía sau. Khách không vào bếp, không đụng vào sổ cái. Khách chỉ nói yêu cầu theo đúng cách tiệm quy định, rồi nhận về thứ tiệm trả.

Cuộc trao đổi luôn có hai nửa:

Request (yêu cầu): client gửi đi. Ví dụ: “Cho tôi xem danh sách đơn hôm nay.”
Response (phản hồi): server trả về. Ví dụ: “Đây là 47 đơn” hoặc “Bạn chưa đăng nhập, không xem được.”

Một điểm hay gây bối rối: cùng một máy có thể vừa là client vừa là server. Khi bạn chạy Mộc OMS trên laptop để thử nghiệm, laptop vừa chạy server (phần mềm Mộc OMS) vừa chạy client (trình duyệt mở http://localhost:3000). Chữ localhost nghĩa là “chính máy này”. Bạn sẽ gặp lại nó rất thường xuyên khi làm việc với coding agent.

URL: địa chỉ đầy đủ của một “món hàng”

URL (Uniform Resource Locator) là địa chỉ đầy đủ của một tài nguyên trên web. Hãy mổ xẻ một URL của Mộc OMS:

Phiên agent

https://oms.banhmoc.vn/don-hang/BM-261012-007?tab=lich-su#thanh-toan
└─┬─┘   └──────┬─────┘└──────────┬──────────┘└────┬─────┘└─────┬────┘
 giao      tên máy chủ       đường dẫn        tham số     vị trí trong
 thức      (host)            (path)           truy vấn    trang
(scheme)                                      (query)     (fragment)

Phần	Ví dụ	Ý nghĩa
Scheme (giao thức)	`https`	Cách nói chuyện: `https` là HTTP có mã hóa
Host (tên máy chủ)	`oms.banhmoc.vn`	Gửi tới đâu. `banhmoc.vn` là tên miền, `oms` là tên miền con (subdomain)
Path (đường dẫn)	`/don-hang/BM-261012-007`	Muốn tài nguyên nào trên máy chủ đó: đơn hàng mã `BM-261012-007`
Query (tham số)	`?tab=lich-su`	Thông tin bổ sung dạng `khóa=giá trị`, nối nhau bằng `&`
Fragment	`#thanh-toan`	Vị trí trong trang; chỉ trình duyệt dùng, không gửi lên server

Có một phần ẩn: cổng (port). Giống một tòa nhà có nhiều cửa, mỗi cửa phục vụ một loại việc. HTTPS mặc định dùng cổng 443, HTTP dùng cổng 80, nên ta không cần ghi. Khi chạy thử trên máy, Next.js mặc định dùng cổng 3000, vì vậy địa chỉ là http://localhost:3000.

DNS và địa chỉ IP: danh bạ của Internet

Máy tính không hiểu tên oms.banhmoc.vn. Trên Internet, mỗi máy được định danh bằng một địa chỉ IP (Internet Protocol address), giống số nhà. Địa chỉ IPv4 có dạng bốn con số như 203.0.113.10; IPv6 dài hơn, như 2001:db8::10. (Các địa chỉ trong bài là địa chỉ dành riêng cho ví dụ, không phải máy thật.)

Con người nhớ tên, máy cần số. DNS (Domain Name System, hệ thống tên miền) là danh bạ đổi tên thành số. Khi bạn gõ oms.banhmoc.vn, trình duyệt hỏi DNS: “Tên này ở số nhà nào?” DNS trả lời: “Ở 203.0.113.10.” Lúc đó trình duyệt mới biết gửi yêu cầu đi đâu.

Vài điều thực tế về DNS mà chủ doanh nghiệp nên biết:

Tên miền là tài sản thuê theo năm: bạn đăng ký banhmoc.vn qua nhà đăng ký tên miền và gia hạn định kỳ. Quên gia hạn thì website “biến mất” dù server vẫn chạy.
DNS có bộ nhớ đệm (cache): để nhanh, các máy trên đường đi ghi nhớ câu trả lời trong một khoảng thời gian (gọi là TTL). Vì vậy khi bạn đổi tên miền trỏ sang server mới, có người thấy ngay, có người phải chờ một lúc. Người ta hay gọi là “chờ DNS cập nhật”.
Lỗi DNS có thông báo đặc trưng: trên Chrome là DNS_PROBE_FINISHED_NXDOMAIN, nghĩa là “danh bạ không có tên này”. Thường do gõ sai tên miền, tên miền hết hạn, hoặc cấu hình DNS sai.

Cách cấu hình bản ghi DNS và trỏ tên miền về hosting sẽ được hướng dẫn kỹ trong bài Tên miền, DNS và HTTPS10-03.

Hành trình một request tới Mộc OMS

Bây giờ ghép tất cả lại. Hà đang ở chi nhánh Phú Nhuận, mở điện thoại và vào https://oms.banhmoc.vn/don-hang để xem đơn hôm nay. Trong khoảng một giây, những việc sau xảy ra:

Hình chữ ký Hành trình request

Hà (trình duyệt)
Máy chủ DNS
Server Mộc OMS
Database
GET /don-hang (kèm cookie đăng nhập)
200 OK + trang HTML danh sách đơn

Xem sơ đồ gốc (Hình 1)

Vuốt ngang để xem hết sơ đồ

Hà (trình duyệt)oms.banhmoc.vn ở địa chỉ IP nào?1203.0.113.102Mở kết nối an toàn (bắt tay TLS, kiểm tra chứng chỉ)3Chứng chỉ hợp lệ, kênh mã hóa sẵn sàng4GET /don-hang (kèm cookie đăng nhập)5Kiểm tra cookie, xác định Hà là staff chi nhánh Phú Nhuận6Lấy đơn hôm nay của chi nhánh Phú Nhuận747 dòng dữ liệu8200 OK + trang HTML danh sách đơn9Tải thêm CSS, JavaScript, ảnh logo10200 OK (các file tĩnh)11Trình duyệt dựng trang và hiển thị12

Hình 1 Sơ đồ tuần tự

Đọc sơ đồ dạng chữ

Hà (trình duyệt) → Máy chủ DNS: oms.banhmoc.vn ở địa chỉ IP nào?
Máy chủ DNS → Hà (trình duyệt): 203.0.113.10
Hà (trình duyệt) → Server Mộc OMS (Next.js trên Vercel): Mở kết nối an toàn (bắt tay TLS, kiểm tra chứng chỉ)
Server Mộc OMS (Next.js trên Vercel) → Hà (trình duyệt): Chứng chỉ hợp lệ, kênh mã hóa sẵn sàng
Hà (trình duyệt) → Server Mộc OMS (Next.js trên Vercel): GET /don-hang (kèm cookie đăng nhập)
Server Mộc OMS (Next.js trên Vercel) → Server Mộc OMS (Next.js trên Vercel): Kiểm tra cookie, xác định Hà là staff chi nhánh Phú Nhuận
Server Mộc OMS (Next.js trên Vercel) → Database (Supabase PostgreSQL): Lấy đơn hôm nay của chi nhánh Phú Nhuận
Database (Supabase PostgreSQL) → Server Mộc OMS (Next.js trên Vercel): 47 dòng dữ liệu
Server Mộc OMS (Next.js trên Vercel) → Hà (trình duyệt): 200 OK + trang HTML danh sách đơn
Hà (trình duyệt) → Server Mộc OMS (Next.js trên Vercel): Tải thêm CSS, JavaScript, ảnh logo
Server Mộc OMS (Next.js trên Vercel) → Hà (trình duyệt): 200 OK (các file tĩnh)
Hà (trình duyệt) → Hà (trình duyệt): Trình duyệt dựng trang và hiển thị

Đọc từng bước:

Tra danh bạ (bước 1–2): trình duyệt hỏi DNS địa chỉ IP. Nếu vừa hỏi gần đây, câu trả lời có sẵn trong bộ nhớ đệm và bước này gần như tức thì.
Bắt tay an toàn (bước 3–4): trình duyệt mở kết nối tới server và thực hiện “bắt tay” TLS: server đưa ra chứng chỉ chứng minh “tôi đúng là oms.banhmoc.vn“, hai bên thống nhất cách mã hóa.
Gửi request (bước 5): trình duyệt gửi yêu cầu GET /don-hang, kèm cookie, một mẩu thông tin nhỏ giúp server nhận ra Hà đã đăng nhập.
Server xử lý (bước 6–8): server kiểm tra Hà là ai, có quyền gì, rồi hỏi database đúng phần dữ liệu Hà được xem.
Trả response (bước 9): server gửi về mã 200 OK và nội dung trang.
Tải tài nguyên phụ (bước 10–11): trang HTML “gọi” thêm file giao diện (CSS), file chương trình chạy trên trình duyệt (JavaScript), ảnh. Mỗi thứ là một request riêng.
Hiển thị (bước 12): trình duyệt ghép tất cả thành trang Hà nhìn thấy.

Giá trị thực tế của sơ đồ này: mỗi mũi tên là một chỗ có thể hỏng. Bước 1 hỏng là lỗi DNS. Bước 3 hỏng là lỗi chứng chỉ. Bước 6 hỏng là lỗi đăng nhập. Bước 7 hỏng là lỗi database. Khi agent báo lỗi, câu hỏi đầu tiên của bạn nên là: “Lỗi xảy ra ở mũi tên nào?”

HTTP: ngôn ngữ chung của quầy order

HTTP (HyperText Transfer Protocol) là quy ước trao đổi giữa client và server, giống mẫu phiếu order chuẩn mà mọi tiệm đều hiểu. Một request HTTP thô trông như sau:

Phiên agent

POST /api/orders HTTP/1.1
Host: oms.banhmoc.vn
Content-Type: application/json
Cookie: session=abc123...

{"customerPhone": "0901234123", "items": [{"productId": "a3c9e5f4-7f6b-4c8d-8e1f-2a3b4c5d6e7f", "quantity": 1}]}

Và response tương ứng:

Phiên agent

HTTP/1.1 201 Created
Content-Type: application/json

{"code": "BM-261012-007", "status": "moi", "total": 450000}

Bốn thành phần của một request:

Method (phương thức): hành động muốn làm, ở đây là POST (tạo mới).
Path: tài nguyên nào, ở đây là /api/orders.
Header (tiêu đề): thông tin kèm theo, như “nội dung tôi gửi là JSON”, “đây là cookie đăng nhập của tôi”. Giống phần ghi chú trên bìa phong bì.
Body (thân): nội dung chính, ở đây là dữ liệu đơn hàng. Request GET thường không có body.

Response có mã trạng thái (status code), header và body. Định dạng {"code": ...} bạn thấy ở trên là JSON, sẽ được giải thích kỹ trong bài JSON và API01-07.

Các HTTP method thường gặp

Method	Ý nghĩa	Ví dụ trong Mộc OMS
`GET`	Lấy, xem dữ liệu; không được làm thay đổi gì	Xem danh sách đơn hôm nay
`POST`	Tạo mới hoặc gửi một hành động	Tạo đơn mới, gửi form đăng nhập
`PUT`	Thay thế toàn bộ một tài nguyên	Ghi đè toàn bộ thông tin một sản phẩm
`PATCH`	Sửa một phần	Đổi trạng thái đơn từ `moi` sang `da_xac_nhan`
`DELETE`	Xóa	Xóa một sản phẩm ngừng bán (thực tế thường “ẩn” thay vì xóa hẳn)

Mã trạng thái: đèn báo kết quả

Mã trạng thái là con số ba chữ số, chữ số đầu cho biết nhóm. Nhớ được bốn nhóm này là bạn đã khoanh vùng được phần lớn lỗi:

2xx: thành công. Bếp nhận đơn và làm xong.
3xx: chuyển hướng. “Tiệm đã dời sang địa chỉ mới, mời qua bên kia.”
4xx: lỗi phía client. Khách gọi món không có trong menu, hoặc chưa trả tiền. Sửa yêu cầu, không phải sửa bếp.
5xx: lỗi phía server. Bếp cháy, máy hỏng. Khách không làm gì sai cả.

Mã	Tên	Khi nào gặp	Nên nghĩ gì
200	OK	Mọi thứ bình thường	Thành công
201	Created	Tạo đơn mới thành công	Thành công, có tài nguyên mới
301 / 302	Moved / Found	Đổi địa chỉ trang, chuyển về trang đăng nhập	Thường bình thường; nếu lặp vô hạn là lỗi cấu hình
400	Bad Request	Gửi dữ liệu sai định dạng	Kiểm tra dữ liệu gửi đi
401	Unauthorized	Chưa đăng nhập, hết phiên	Đăng nhập lại; kiểm tra cookie, token
403	Forbidden	Đã đăng nhập nhưng không đủ quyền	Kiểm tra phân quyền (staff xem đơn chi nhánh khác?)
404	Not Found	Đường dẫn hoặc tài nguyên không tồn tại	Sai URL, sai mã đơn, hoặc trang chưa được tạo
422	Unprocessable Content	Dữ liệu đúng định dạng nhưng sai quy tắc	Ví dụ giờ nhận bánh nằm trong quá khứ
429	Too Many Requests	Gọi quá nhiều trong thời gian ngắn	Bị giới hạn tốc độ, cần chờ hoặc giảm tần suất
500	Internal Server Error	Code phía server bị lỗi	Xem log server; đây là lỗi của chương trình
502 / 504	Bad Gateway / Gateway Timeout	Máy trung gian không nhận được trả lời hợp lệ hoặc kịp thời	Server phía sau chết, quá tải hoặc quá chậm
503	Service Unavailable	Server tạm thời không phục vụ	Bảo trì, quá tải

HTTPS: bưu thiếp và phong bì niêm phong

HTTP thuần giống gửi bưu thiếp: ai cầm nó trên đường đi (người cùng mạng Wi-Fi quán cà phê, thiết bị trung gian) đều đọc được. HTTPS là HTTP đi trong phong bì niêm phong có con dấu, nhờ lớp mã hóa TLS.

Biểu tượng ổ khóa (hoặc biểu tượng tương đương, tùy trình duyệt) bên cạnh địa chỉ web xác nhận hai điều:

Mã hóa: nội dung trao đổi (mật khẩu, thông tin khách hàng, số tiền) không bị đọc lén hay sửa trên đường đi.
Xác thực danh tính server: máy chủ đã trình chứng chỉ (certificate) do một tổ chức đáng tin cậy cấp, chứng minh nó đúng là chủ của tên miền. Giống con dấu đỏ trên phong bì chứng minh thư đến từ đúng cơ quan.

Với Mộc OMS, HTTPS là bắt buộc, không phải tùy chọn: nhân viên đăng nhập bằng mật khẩu, hệ thống chứa số điện thoại, địa chỉ khách hàng, và nhiều tính năng hiện đại của trình duyệt chỉ hoạt động trên HTTPS. Tin tốt là các nền tảng hosting phổ biến hiện nay (như Vercel trong stack của chúng ta) cấp chứng chỉ HTTPS tự động.

Vì sao những điều này quan trọng khi làm việc với AI

Khi bạn làm việc với coding agent, bạn sẽ liên tục nhận được thông báo như:

Phiên agent

GET http://localhost:3000/api/orders 500 (Internal Server Error)
POST /api/orders 401 Unauthorized
Failed to fetch
net::ERR_NAME_NOT_RESOLVED

Với kiến thức trong bài, bạn có thể “dịch” được ngay:

Dòng 1: lỗi trong code phía server của trang danh sách đơn. Cần xem log server, không phải chỉnh giao diện.
Dòng 2: request tạo đơn bị từ chối vì chưa đăng nhập hoặc mất phiên.
Dòng 3: trình duyệt không nói chuyện được với server, có thể server chưa chạy, sai địa chỉ, hoặc bị chặn.
Dòng 4: lỗi DNS, tên máy chủ không phân giải được.

Biết lỗi ở mũi tên nào, bạn sẽ viết prompt gỡ lỗi chính xác hơn và nhận ra khi agent đang “sửa nhầm chỗ”, ví dụ chỉnh màu nút bấm để xử lý một lỗi 500. Quy trình gỡ lỗi bài bản được hướng dẫn trong bài Debug cùng AI06-07.

Áp dụng vào dự án Bánh Mộc

Nhật ký công trình · Bánh Mộc

BM-261013-008

13.10.2026

Chị LanChủ chuỗi
HàBán hàng online

Hà đưa điện thoại báo lỗi, chị Lan ghim phiếu báo lỗi năm câu hỏi lên bảng gần quầy

Hãy tưởng tượng vài tháng sau, Mộc OMS đã chạy. Một sáng thứ bảy, Hà nhắn: “Chị ơi, web đơn hàng không vào được!” Trước đây chị Lan sẽ hoảng và gọi ngay cho ai đó. Bây giờ chị đi qua một danh sách câu hỏi ngắn theo đúng hành trình request:

Đường sá có ổn không? “Em vào Facebook được không?” Nếu không, đó là Wi-Fi của tiệm, không phải Mộc OMS.
Danh bạ có ổn không? “Màn hình báo gì?” Nếu báo DNS_PROBE_FINISHED_NXDOMAIN, chị kiểm tra tên miền banhmoc.vn có hết hạn không.
Ổ khóa có ổn không? Nếu trình duyệt cảnh báo “Kết nối không riêng tư”, có vấn đề với chứng chỉ HTTPS.
Server trả mã gì? Chị nhờ Hà chụp màn hình. Trang báo 500 là lỗi code hoặc database phía server, cần xem hệ thống giám sát lỗi. Trang báo 403 là phân quyền, có thể tài khoản của Hà bị đổi chi nhánh.

Chị Lan biến danh sách này thành một mẫu báo lỗi ghim trong nhóm Zalo nhân viên:

Phiên agent

BÁO LỖI MỘC OMS
1. Bạn đang ở chi nhánh nào, dùng điện thoại hay máy tính?
2. Các web khác (Facebook, Google) có vào được không?
3. Địa chỉ đầy đủ trên thanh địa chỉ là gì? (chụp màn hình cả thanh địa chỉ)
4. Màn hình báo chữ gì hoặc số gì? (404, 500, "không riêng tư"...)
5. Lỗi bắt đầu từ lúc nào? Bạn vừa làm thao tác gì?

Với mẫu này, mỗi khi cần nhờ agent gỡ lỗi, chị đã có sẵn đúng các manh mối agent cần: URL, mã trạng thái, thời điểm, thao tác tái hiện. Chị nhận ra một điều: phần khó nhất của gỡ lỗi không phải viết code sửa, mà là mô tả lỗi chính xác.

Prompt mẫu

Prompt 1: nhờ AI giải thích một lỗi theo hành trình request.

Tôi là người không chuyên. Ứng dụng web của tôi báo lỗi sau (dán nguyên văn):
[dán thông báo lỗi hoặc ảnh chụp tab Network]

Hãy giải thích:
1. Lỗi xảy ra ở bước nào trong hành trình request (DNS, kết nối/HTTPS, server xử lý,
   database, hay trình duyệt hiển thị)?
2. Đây là lỗi phía client hay phía server? Dựa vào dấu hiệu nào?
3. Ba nguyên nhân khả dĩ nhất, xếp theo khả năng, và cách kiểm tra từng cái.
Đừng sửa code vội. Chỉ giúp tôi khoanh vùng trước.

Prompt 2: kiểm tra thiết kế method và mã trạng thái do agent viết.

Hãy liệt kê mọi endpoint/route bạn đã tạo trong tính năng đơn hàng, dạng bảng:
method, đường dẫn, việc nó làm, các mã trạng thái nó có thể trả về và khi nào.
Đánh dấu bất kỳ chỗ nào dùng GET để thay đổi dữ liệu, hoặc trả 200 khi thực ra là lỗi.

Prompt 3: học bằng cách quan sát.

Tôi vừa mở tab Network khi tải trang danh sách đơn hàng và thấy các request sau
(dán danh sách tên, method, status, type). Hãy giải thích từng request dùng để làm gì,
request nào là trang chính, request nào là tài nguyên phụ, và có dấu hiệu gì bất thường không.

Sai lầm thường gặp

Sự cố 01

Coi mọi lỗi là “web hỏng”.

Triệu chứng

Không phân biệt được mất mạng, lỗi DNS, lỗi 4xx hay 5xx, nên mô tả lỗi cho agent quá chung chung.

Cách tránh

Luôn thu thập URL đầy đủ, mã trạng thái, thông báo nguyên văn. Dùng mẫu báo lỗi năm câu ở trên.
Sự cố 02

Sửa phía client khi lỗi ở server (và ngược lại).

Triệu chứng

Thấy lỗi 500 lại đi sửa giao diện; thấy lỗi 401 lại đi sửa database.

Cách tránh

Nhớ quy tắc: 4xx thì xem lại yêu cầu (dữ liệu gửi, đăng nhập, quyền); 5xx thì xem log server.
Sự cố 03

Dùng GET cho hành động thay đổi dữ liệu.

Triệu chứng

Link “hủy đơn” dạng GET có thể bị kích hoạt ngoài ý muốn bởi trình xem trước link hoặc bot.

Cách tránh

Yêu cầu agent dùng POST/PATCH/DELETE cho mọi thay đổi và tự kiểm tra bảng endpoint.
Sự cố 04

Tin ổ khóa tuyệt đối.

Triệu chứng

Nghĩ có HTTPS là an toàn, trong khi trang lừa đảo cũng có HTTPS.

Cách tránh

Kiểm tra tên miền chính xác; đào tạo nhân viên về lừa đảo đăng nhập.
Sự cố 05

Quên tên miền là tài sản cần gia hạn.

Triệu chứng

Tên miền hết hạn, toàn bộ hệ thống “biến mất” dù code và dữ liệu vẫn nguyên.

Cách tránh

Bật tự động gia hạn, dùng email quản trị mà bạn thường xuyên đọc, ghi ngày hết hạn vào lịch.

Checklist

Tôi phân biệt được Internet và Web, client và server.
Tôi chỉ ra được scheme, host, path, query trong một URL bất kỳ.
Tôi giải thích được DNS làm gì và vì sao đổi DNS cần thời gian.
Tôi kể lại được hành trình request theo sơ đồ tuần tự mà không cần nhìn.
Tôi biết 5 HTTP method và khi nào dùng cái nào.
Tôi phân biệt được nhóm mã 2xx, 3xx, 4xx, 5xx và hướng xử lý tương ứng.
Tôi đã mở thử tab Network của trình duyệt và đọc được cột Status.
Tôi hiểu ổ khóa HTTPS bảo vệ gì và không bảo vệ gì.

Bài tập thực hành

Bài 1

Cơ bản

Mổ xẻ URL

Mở 3 trang bạn hay dùng (một trang tin tức, một trang mua sắm có tìm kiếm, một trang có đăng nhập). Chép URL và tách thành scheme, host, path, query.

Kết quả mong đợi

Bạn nhận ra query thường chứa từ khóa tìm kiếm, bộ lọc, số trang; path thường phản ánh cấu trúc nội dung (danh mục, mã sản phẩm).
Bài 2

Cơ bản

Quan sát tab Network

Mở một trang bất kỳ, bật tab Network, tải lại trang. Đếm xem có bao nhiêu request, có bao nhiêu mã khác 200. Thử gõ một đường dẫn không tồn tại trên trang đó và xem mã trả về.

Kết quả mong đợi

Một trang thông thường có hàng chục đến hàng trăm request; đường dẫn không tồn tại thường trả 404.
Bài 3

Nâng cao

Vẽ lại hành trình cho một tình huống lỗi

Lấy sơ đồ tuần tự trong bài. Với mỗi tình huống sau, chỉ ra mũi tên nào hỏng và người dùng sẽ thấy gì: (a) tên miền hết hạn; (b) database Supabase tạm ngừng; (c) tài khoản của Hà bị chuyển sang chi nhánh Gò Vấp nhưng Hà mở link đơn của Phú Nhuận; (d) chứng chỉ HTTPS hết hạn.

Kết quả mong đợi

(a) bước 1–2, lỗi DNS; (b) bước 7–8, server thường trả 500 hoặc 503; (c) bước 6, 403 hoặc 404 tùy thiết kế; (d) bước 3–4, trình duyệt cảnh báo kết nối không an toàn.

Thuật ngữ trong bài

Internet: Mạng lưới vật lý nối các thiết bị trên thế giới
Web: Dịch vụ trang web chạy trên Internet
Client: Bên gửi yêu cầu (trình duyệt, app)
Server: Bên nhận yêu cầu, xử lý và trả kết quả
Request / Response: Yêu cầu gửi đi / phản hồi trả về
URL: Địa chỉ đầy đủ của một tài nguyên trên web
Tên miền (domain): Tên dễ nhớ như banhmoc.vn, thuê theo năm
Địa chỉ IP: “Số nhà” của một máy trên Internet
DNS: “Danh bạ” đổi tên miền thành địa chỉ IP
Port (cổng): “Cửa” trên một máy, ví dụ 443 cho HTTPS, 3000 cho Next.js khi chạy thử
localhost: Chính máy tính bạn đang dùng
HTTP: Quy ước trao đổi giữa client và server
Method: Hành động của request: GET, POST, PUT, PATCH, DELETE
Header: Thông tin kèm theo request/response
Body: Nội dung chính của request/response
Status code: Mã ba chữ số cho biết kết quả request
Cookie: Mẩu thông tin trình duyệt gửi kèm để server nhận ra bạn
HTTPS / TLS: HTTP có mã hóa và xác thực danh tính server
Chứng chỉ (certificate): “Con dấu” chứng minh server đúng là chủ tên miền

Đọc thêm

MDN Web Docs: tìm “HTTP overview”, “HTTP response status codes”, “What is a URL” để có giải thích chính thức, dễ hiểu.
Frontend, backend, database: ba tầng của một ứng dụng01-03
JSON và API: cách các phần mềm nói chuyện với nhau01-07
Thiết kế API: endpoint, phương thức, mã trạng thái và hợp đồng dữ liệu04-04
Tên miền, DNS và HTTPS10-03

Nghiệm thu tờ 01-02

Đọc xong và tự kiểm theo phiếu nghiệm thu, rồi đánh dấu tờ này.

Tác giả

Phú Digital

Đội ngũ PDL Digital — triển khai website, giải pháp AI và digital marketing cho doanh nghiệp.

Các HTTP method thường gặp

Mã trạng thái: đèn báo kết quả

Prompt 1: nhờ AI giải thích một lỗi theo hành trình request.

Prompt 2: kiểm tra thiết kế method và mã trạng thái do agent viết.

Prompt 3: học bằng cách quan sát.

Coi mọi lỗi là “web hỏng”.

Sửa phía client khi lỗi ở server (và ngược lại).

Dùng GET cho hành động thay đổi dữ liệu.

Tin ổ khóa tuyệt đối.

Quên tên miền là tài sản cần gia hạn.

Mổ xẻ URL

Quan sát tab Network

Vẽ lại hành trình cho một tình huống lỗi

Muốn dựng phần mềm riêng cho doanh nghiệp của bạn?

Nhận tư vấn miễn phí

Nhận tư vấn
miễn phí