Client & Server
- 客戶端 (client-side): 發出
請求 (request)端 - 伺服器端 (server-side): 給予
回應 (response)端
兩端來循環的溝通流程稱為 request/response cycle
HTTP 傳輸協定
人與人使用語言溝通，機器之間交流也有格式、語法，稱為傳輸協定 (protocol)
- 設備定位位址，使用
網路傳輸協定 (Internet Protocol, IP) - 交流文件，使用
超文本傳輸協定 (HyperText Transfer Protocol, HTTP) - 收發電子郵件，使用
簡易郵件傳輸協定 (Simple Mail Transfer Protocol, SMTP)
使用 Browser 看 HTTP
打開 DevTools 查看 Network ，刷新網頁可以看到很多 server-side 回應資源。
HTTP 組成架構
| HTTP Request | HTTP Response |
|---|---|
| Request method | Response Status |
| Request URL | Response Headers |
| Request Headers | Response Body |
| Message Body | — |
HTTP Request
| method | URL | headers | message body |
|---|---|---|---|
| get | www.example.com | Host | — |
| post | www.example.com/photos | — | — |
| patch | www.example.com/photos?page=1 | — | — |
| put | — | — | — |
| delete | — | — | — |
- GET：讀取資料
- POST：新增資料
- PATCH：修改資料
- PUT：修改資料 (如果沒有該筆資料存在，則新增資料)
- DELETE：刪除資料
HTTP Response
| status | response headers | response body |
|---|---|---|
| 200 | content-type | <html>...</html> |
| 300 | … | — |
| 400 | — | — |
| 500 | — | — |
- 2XX：成功回應
- 3XX：重新轉向，例如 301 (永久轉向)、302 (暫時轉向)
- 4XX：客户端錯誤回應，例如 404 Not Found (找不到資源)
- 5XX：伺服器的問題，例如 500 Internal Server Error
網路資源、URL
網路資源(web resourse)為泛稱，圖檔、文件、程式、程式內部組件皆是。
URL為統一資源定位符(Uniform Resource Locator)，俗稱網址(Web address)，相當於現實世界的門牌號碼。
Protocol
為網址最前面的 http:// ，傳輸協一不一定只有 http 。
有可能是 http、https、ssh、ftp、file。
Host
主機(host)，自架主機會有一串數字192.168.0.0之類的，稱之為 Internet Protocal，簡稱 IP。
由於數字不便記憶，所以會租用網域名稱(domain name)，成為www.example.com。
Path
網域名稱後面所接的是檔案路徑，例如: /css/style.cs，每一台主機存放著許多檔案，該路徑也是唯一路徑。
Port
通訊埠 (port)，存在網址中，但通常會隱藏。http://www.example.com:80/css/style.css
Parameter
網址可以夾雜參數(Parameter)，也稱查詢符(query)，使用 ? 開頭，& 區隔，為搭配功能需求而設計。
現代網路架構
現代網路架構由路由(route)系統指派網址與資源，所以檔案目錄與URL路徑不一定相同。
路由
使用英文會比較容易理解，中文容易混淆。
- Router : 路由器，為實體設備，幫每個資料封包(pack)選擇路徑
- Routing : 「路由器幫資料封包們選擇路徑，引導資料按指定路徑移動」的過程。
- Route : 路由器所選出的路徑本身
設計路由
使用 REST 架構，全名Representational State Transfer，「具象狀態傳輸」，其風格為 RESTRful。
RESTRful 以 資料 為中心，使用 HTTP method verb and CRUD 資料操作。
HTTP Method:
GET、POST、PATCH、PUT、DELETE。
CRUD:
Create、Read、Update、Delete。
資料來源: Alpha camp