HTTP 全名是 HyperText Transfer Protocol(超文字傳輸協定)
可以想像它是瀏覽器與伺服器之間的溝通語言,負責定義雙方如何傳送與接收資料
HTTP 是 「請求 - 回應」(Request-Response)模式,運作流程大致是這樣:
建立連線
瀏覽器輸入網址,例如 https://google.com
會先透過 DNS 找到伺服器 IP,然後建立 TCP 連線(如果是 HTTPS,還要先進行 SSL/TLS 加密握手)
發送 HTTP 請求(Request)
瀏覽器會發送請求訊息(message request),包含:
伺服器回應(Response)
伺服器收到請求後,處理完會傳送應答,包含:
瀏覽器渲染內容
收到回應後,瀏覽器就會把 HTML 解析成畫面,或處理 JSON、圖片等資源
圖片來源:https://blog.bytebytego.com/p/a-deep-dive-into-http-from-http-1
方法 | 用途 | 請求有payload body |
---|---|---|
GET | 取得資源 | 選擇性 |
POST | 新增/提交資料 | 是 |
PUT | 更新整個資源 | 是 |
PATCH | 部分更新資源 | 是 |
DELETE | 刪除資源 | 選擇性 |
HEAD | GET方法一樣,但只取得回應標頭,不要主體 | 選擇性 |
OPTIONS | 詢問伺服器支援哪些方法(測試伺服器功能是否正常運作) | 選擇性 |
大部分都是向下相容的
版本 | 特點 |
---|---|
HTTP/0.9 | 只有 GET 方法,因此無法向伺服器傳太多訊息 |
HTTP/1.0 | 支援更多方法(POST 、HEAD ),支援多種內容型別 |
HTTP/1.1 | 預設長連線(Keep-Alive)、快取控制 |
HTTP/2 | 修復隊頭阻塞問題、多個請求合併到一個TCP連線內、Header 壓縮 |
HTTP/3 | 不依賴TCP,採用基於 QUIC 協議(UDP的),延遲更低、連線更快 |
類別 | 類別意義 | 狀態碼 | 狀態碼意義 |
---|---|---|---|
1xx 資訊 | 請求已收到,正在繼續處理 | 100 Continue | 表示可以繼續傳剩下的內容 |
2xx 成功 | 請求成功 | 200 OK | 請求成功! |
201 Created | 新資源成功建立,例如用 POST 建立了一筆新的資料,回應時可能會附上新資源的 URL |
||
3xx 重新導向 | 要求的資源位置已改變 | 301 Moved Permanently | 永久移到新位置,告訴瀏覽器以後都應該去新的 URL |
302 Found | 臨時移到新位置,本次請求去新 URL,但下次還是用原本的 | ||
303 See Other | 請用 GET 方法到另一個 URL 抓資料(常在表單送出後使用) |
||
304 Not Modified | If-Modified-Since或If-None-Match參數未曾被修改,有一前的副本,不用重新傳輸資源 | ||
4xx 用戶端錯誤 | 找不到資源或語法錯誤 | 400 Bad Request | 請求格式錯誤(可能是 JSON 格式錯誤、缺少必要參數) |
401 Unauthorized | 未授權,需登入 | ||
403 Forbidden | 伺服器理解請求,但拒絕訪問 | ||
404 Not Found | 找不到資源(通常網址錯誤或資源被刪除) | ||
5xx 伺服器錯誤 | 伺服器內部錯誤 | 500 Internal Server Error | 最常見的伺服器錯誤(可能是程式 bug 或設定錯誤造成) |
501 Not Implemented | 伺服器不支援此請求方法(像是 API 尚未開發) | ||
502 Bad Gateway | 作為「代理伺服器」時,從上游伺服器收到無效回應(例如 Nginx → 後端掛了) | ||
503 Service Unavailable | 伺服器暫時無法處理請求(過載、維護中) |
可以在輸入一個不存在的網址:https://example.com/abcxyz
點開開發者工具 → 網路 → 重新整理網頁
就可以看到狀態碼那邊有出現404,表示此頁面不存在
點選要查看的請求,點選標頭就可以看到Header、點選預覽就可以看到Body資訊(但是Body 也有可能看不到)
https://zh.wikipedia.org/zh-tw/超文本传输协议
https://zh.wikipedia.org/wiki/HTTP/2
https://zh.wikipedia.org/wiki/HTTP状态码
https://israynotarray.com/other/20220104/255997626/
https://blog.bytebytego.com/p/a-deep-dive-into-http-from-http-1