初學者都該了解的 HTTP 通訊協定基礎

參考網站 - 初學者都該學會的 HTTP 通訊協定基礎
 參考網站 - Http/2 是什麼?

目前 HTTP 通訊協定的版本

HTTP/0.9
- 於 1991 年發表(已廢止)
HTTP/1.0
- 於 1996 年 5 月發表(RFC 1945)
HTTP/1.1
- 於 1997 年 1 月發表(RFC 2068)
- 於 1999 年 6 月發布 HTTP/1.1 更新版(RFC 2616)
- 於 2014 年 6 月再次更新 HTTP/1.1 並將規格文件拆成六份
HTTP/2(Wikipedia)
- 於 2015 年 5 月發布(RFC 7540)(瀏覽器相容性)
- 僅針對 HTTP/1.1 的 Message Syntax 部分作出強化

HTTP/0.9 (已廢止)

概要

於 1990 年由 Tim Berners-Lee 提出最初的 HTTP 建議(WWW)
實作重點
- 用戶端要求是以 ASCII 字元為主(單行命令即可發出請求 GET/)
- 用戶端要求會以一個 換行字元 (CRLF) 來結束
- 伺服器回應是以 ASCII 字元為主，回應內容是 HTML 文件
- 每次執行完 Request / Response 就會自動關閉連線
主要特色
- Client / Server 架構、Request / Response 協定
- 跑在 TCP/IP 上的 ASCII 協定 (要求/回應)
- 被設計用來傳輸 HTML 文件
- 每完成一次 ASCII 協定就會自動關閉連線

使用 bash 測試

1
2
3
4
5
6
7
8
# 建立連線到 google
$ telnet google.com 80
> Connected to google.com.
> Escape character is '^]'.

# 發送 GET 請求
$ GET /about
> ...

HTTP/1.0

概要

在 1991 到 1995 年之間，所謂 瀏覽器 騰空出世！
於 1996 年 5 月發表 HTTP/1.0 版 (RFC 1945)
與 HTTP/0.9 不同的部分
- 用戶端要求是以 ASCII 字元為主，但可發送多行命令(含要求標頭)
  - 先送出要求方法，再送出要求標頭，最後以一個額外的換行字元結束
- 伺服器回應是以 ASCII 字元為主，回應內容會區分為
  - 狀態列
  - 回應標頭
  - 回應內文主體(不僅僅是 HTML 文件，可以是更多內容類型)
- 每完成一次 Request / Response 交握就會自動關閉 TCP/IP 連線

使用 bash 測試

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
# 建立連線到 google
$ telnet google.com 80
> Trying 172.217.24.14...
> Connected to google.com.
> Escape character is '^]'.

# 發送 GET 請求
$ GET /about HTTP/1.0
Host: www.google.com # 因一個 domain 可以 hosting 多個網站，因此通常都會於 request header 再標記 Host

> HTTP/1.0 301 Moved Permanently
> ...

# 取得後，會自動中斷 TCP 連線
# 若需再發送請求，需重新建立 TCP 連線
$ telnet google.com 80
...

HTTP/1.1

概要

於 1997 年 1 月發表 HTTP/1.1 版 (RFC 1945)
於 1999 年 6 月發布 HTTP/1.1 更新版 (RFC 2616)
與 HTTP/1.0 不同的部分
- 傳輸協議的效能改進(新增不少 HTTP 標頭定義)
  - 持續連線狀態(persistent connection)
  - 切塊編碼傳輸(chunked encoding transfer)
  - 位元範圍請求(byte range request)
  - 額外快取機制(cache control)
  - 請求管線作業(request pipelining)(需搭配持續連線狀態特性才能用)

使用 bash 測試

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
# 建立連線到 google
$ telnet google.com 80
> Trying 172.217.24.14...
> Connected to google.com.
> Escape character is '^]'.

# 發送 GET 請求
$ GET /about HTTP/1.1
Host: www.google.com # 因一個 domain 可以 hosting 多個網站，因此通常都會於 request header 再標記 Host

> HTTP/1.0 301 Moved Permanently
> ...

# 取得後，不會自動中斷 TCP 連線，可再發送請求
$ GET /abc HTTP/1.1
Host: www.google.com # 因一個 domain 可以 hosting 多個網站，因此通常都會於 request header 再標記 Host

> HTTP/1.1 404 Page Not Found
> ...

目前 HTTP/1.1 的六大規格

RFC 7230 HTTP/1.1：Message Syntax and Routing
RFC 7231 HTTP/1.1：Semantics and Content(最重要)
RFC 7232 HTTP/1.1：Conditional Requests
RFC 7233 HTTP/1.1：Range Requests
RFC 7234 HTTP/1.1：Caching
RFC 7235 HTTP/1.1：Authentication

關於 HTTP 通訊協定的基本常識

無狀態特性(stateless)：相同的 request，都會得到相同的 response，不會因為狀態不同而改變
分散式架構(distributed)：相同的 request，不同載體發送，都會得到相同的 response
協作的架構(collaborative)：不一定只有 client / server，也可以是 client / proxy / reverse proxy / server
超文本(hypertext = not just “text) but with “links”)：除了內容，還包含連結

初學者應了解 HTTP 的基本運作方式

如何發出 HTTP 要求(HTTP Request)
- 要求方法(Request Methods)
  - GET、POST、PUT、DELETE、PATCH、…
- 要求標頭(Request Headers)
  - Connection、COntent-Type、…
- 斷行符號(CRLF)
- 要求內容主體(Request Body)
如何回應 HTTP 訊息(HTTP Response)
- 回應狀態碼(Response Status Codes)
  - HTTP/1.1 200 OK
- 回應標頭(Response Headers)
- 斷行符號(CRLF)
- 回應內容主題(Response Body)

HTTP/2

HTTP/2 各個瀏覽器的支援度

點我查看瀏覽器支援度

Edge / Firefox / Chrome / Opera 皆在 2015 年起就支援 HTTP/2，基本上不需要太擔心主流瀏覽器的支援性問題。

PS：如何在 Node.js 中使用 HTTP/2

HTTP/2 改善了什麼？

http/2標準發布於2015年5月，其主要目的是透過一些措施改善瀏覽器瀏覽網頁 加載的速度(page load) 。目前大多數的瀏覽器已支援 http/2 (chrome, firefox, safari等)標準，又 http/2與 http/1.1有著高度的相容信，舉凡request method(post, get..etc), http status code, url, header 等等，因此對於web developer來說，只需要確保你的網站有支援https(因為瀏覽器只支援https 在http/2上)。那麼http/1.1與http/2到底相差多快呢，點我體驗!

HTTP/2 是如何改善？

只需要單一網路連線 (Single TCP connection)

只需要單一網路連線，就可以連接網站伺服器，下載所有需要的資源。大大節省 HTTP/1.1 需要一直建立多個網路連線時的啟動時間浪費。

Request and response multiplexing (多路複用)

在 http/1.1 中，client 端時常會同時發起多個 request 至 server 拿取檔案(像是js, css, image等)，以此方式達到快速載入頁面。如下圖在 http/1.1 中會同時與 server 建立3個 TCP connection，但是瀏覽器通常會限制 TCP connection 同時建立的數目。因此在 http/2 協定中，允許 client 端與同一 server 建立單一 TCP connection 並以非同步方式傳輸要的檔案。

優先權設計 (Prioritization)

伺服器可以決定例如 CSS 或 JavaScript 檔案，哪些要優先傳送。

Header compression (標頭壓縮)

每一個 http 的傳輸中都會攜帶一組 header，在 http/1.1 中，header 會是以明文(plain text)傳輸大小通常會是500-800 bytes，若有攜帶 cookie 也有可能會更大。因此在 http/2 中，會將 request 以及 response 的 header 使用 HPACK 演算法壓縮 header 的內容，此方法壓縮後可以減少 85%-88% 的大小。

Server push (伺服器推送)

在 http/1.1 中，通常 client 端 request 甚麼 server 就會回傳甚麼，例如: 當 client request html 那麼 server 將只會回傳 html。但在 http/2 中，允許 server 主動推送有相關的資料給 client，例如: 當 client 只 request html，但是 server 知道 client request 此 html 後續也會 request css, js 等，因此 server 就會在 client 沒有 request 的情況下主動推送 css, js 檔給 client。那 server 怎麼知道這些檔案是有相關性的呢? web developer 將需要 server push 的檔案加上特定的描述即可。(描述)

不過，這個功能比較有爭議，一來他需要 Web 開發者額外描述有哪些檔案需要隨著 HTML 一起推送給瀏覽器，不是 Web 伺服器升級 HTTP/2 就自動會有。二來它不管瀏覽器是不是已經有快取這個資源，都會推送而造成頻寬浪費。因此實務上筆者認為可以改用瀏覽器的 Prefetch 功能，讓客戶端的瀏覽器自己處理即可。

Binary framing layer (二進制影格層)

在 http/2 中，header 與 body 所挾帶的 property 與 http/1.1 相同(ex. verbs, methods)，然而兩者在傳輸上會有不同。在 http/2 中，會將 header 以及 body 編碼成二進制在 server 與 client 端中傳輸，在 http/1.1 中，則是以明文的方式傳輸。將訊息編碼成二進制進行傳輸，此特性是 http/2 的其他特性的根本基礎。