什麼是 HTTP？

HTTP（HyperText Transfer Protocol）是「超文字傳輸協定」，是網頁瀏覽器與伺服器溝通的語言。

簡單來說，每當你打開一個網站、按一個連結、送出一個表單時，瀏覽器都會偷偷幫你送出一個HTTP 請求（Request），伺服器再回你一個HTTP 回應（Response），你看到的網頁就是這樣來的

HTTP Request: -> 後端
前端 <- HTTP Response

HTTP 請求的基本結構

一個標準的 HTTP Request 由三個部分組成：

(1) 起始行（Request Line）
(2) 標頭（Headers）
(3) 主體（Body） ← 有些請求沒有這一段

例如，當你在網頁上按下搜尋，瀏覽器可能送出的請求會長這樣：

GET /search?q=apple HTTP/1.1
Host: www.google.com
User-Agent: Chrome/120
Accept-Language: zh-TW

解讀：

• GET /search?q=apple HTTP/1.1：請求的第一行，表示方法、路徑與協定版本。
• Host:、User-Agent:、Accept-Language:：這些是 HTTP 標頭（Header）。
• 空白行之後是 Body，但這裡是 GET 請求，所以沒有。

常見的 HTTP 請求方法（Method）

• 瀏覽器最多的請求就是 GET 與 POST

HTTP 標頭（Headers）介紹

HTTP Body（主體）

有些請求會在最後夾帶一段資料 → 這就是 Body。

例如登入表單（POST）：

POST /login HTTP/1.1
Host: example.com
Content-Type: application/x-www-form-urlencoded
Content-Length: 27

username=ken&password=1234

或 JSON API：

POST /api/user HTTP/1.1
Host: api.example.com
Content-Type: application/json

{"name":"Ken","age":18}

• Body 主要用於 POST / PUT / PATCH 請求，GET 通常不含 Body。

範例：用 curl 送 HTTP 請求

用 curl 這個工具在終端機手動送請求

GET

curl -v https://example.com

POST

curl -X POST https://httpbin.org/post -d "name=Ken&age=18"

JSON

curl -X POST https://httpbin.org/post \
  -H "Content-Type: application/json" \
  -d '{"msg":"hello"}'

自訂 Header

curl -H "Authorization: Bearer mytoken" https://api.example.com/data

在瀏覽器中查看 HTTP 請求

• 打開 Chrome / Edge
• 按 F12 或 Ctrl+Shift+I 開啟開發者工具
• 點「Network」分頁
• 重新整理頁面
• 點任一請求，就能看到完整的 Headers、Request Body、Response

安全重點

• HTTP 請求會攜帶 cookie，若未加密（HTTP 而非 HTTPS），容易被竊聽。→ 建議使用 HTTPS + Secure Cookie。
• Authorization header 常攜帶 Bearer Token，必須妥善保護，不可在前端外洩。
• CORS（跨來源資源共享）會用 OPTIONS 請求預先詢問伺服器，判斷跨域是否被允許。
• 開發 API 時，應根據方法（GET / POST / PUT ...）區分用途，符合 RESTful 設計原則。
  | 元件 | 說明 |
  | --- | --- |
  | 起始行 | 指定方法、資源路徑、HTTP 版本 |
  | Header | 攜帶額外資訊，例如格式、身分、cookie |
  | Body| 載送資料的地方，常見於 POST / PUT |
  | 方法 | 決定這次請求要「幹嘛」（GET 讀、POST 寫、DELETE 刪…） |