服務端編程（四）- 背景知識 - request response 深入介紹

服務端編程專欄正在持續更新敬請關注：）

文章目錄

前言 ´･ᴗ･`

前面我們大體介紹了web是怎麼工作的點擊網頁後發生的種種事情這裏讓我們深入瞭解HTTP request 和服務器response
本文可以幫你知曉…
- request method 請求方法有哪些? 一般用來幹嘛?
- HTTP request（尤其是header）的結構
- response （尤其是header）的結構
- query string 請求字符串是什麼
- 常見的狀態碼有哪些 302與200的區別
- POST的request內容和GET的request內容有啥區別， response呢？

HTTP request

我們知道，web瀏覽器與web服務器之間的語言就是HTTP。當你點擊一個web頁面，提交表單或者運行搜索引擎，瀏覽器都會給相應的服務器發送一個HTTP request（當然需要域名解析的時候會先給DNS解析服務器發送hTTP請求）
請求其實就是一個數據包包括

請求資源的URL（Uniform Resource Locator,統一資源定位符） 地址
在WWW萬維網上所有的資源都有自己的地址就是URL 好像我們各家各戶的等級地址一般
請求方法（request method）
其他附加信息（additional info）

請求方法 request method

一個HTTP請求僅有一個請求方法它規定了本次請求的套路是怎麼樣的：

GET: 請求獲取一個具體的資源比如html網頁或者一張圖片
POST: 你向服務器提交submit一些東西比如你登錄時輸入的賬號密碼
HEAD: 找某一資源的metadata 元數據 簡化版的GET —— 不要body主體只需要拿到header的請求方法
PUT: 上傳資源（也可以更新已有資源本質都是上傳文件）
DELETE: 刪資源
TRACE, OPTIONS, CONNECT, PATCH: 這些太罕見或者太高級這裏不提了

附加信息 addtional info

這個附加信息的位置，有三種一般說來，我們分別討論：

URL參數 對於GET方法瀏覽器會把附加信息加密編碼最終放到URL地址裏面，稱爲URL參數，方法是加鍵值對，往往？分割網站網址和我們的附加信息在這裏的附加信息又稱爲 請求字符串query string

什麼是請求字符串呢？我們看另一個例子：
GET https://developer.mozilla.org/en-US/search?q=client+server+overview&topic=apps&topic=html&topic=css&topic=js&topic=api&topic=webdev HTTP/1.1
這是GET方法下的URL，包含了很多信息：
- 請求方式GET
- 目標資源的URL： (/en-US/search).
- URL的參數（URL parameter）也就是請求字符串 (q=client%2Bserver%2Boverview&topic=apps&topic=html&topic=css&topic=js&topic=api&topic=webdev).
- 目標網站： (developer.mozilla.org).
- 最後講明HTTP的協議版本：(HTTP/1.1).
那麼請求字符串其實是一個個鍵值對構成的用&隔開你可以把上面這個拆成：
q=client%2Bserver%2Boverview
topic=apps
topic=html
topic=css
topic=js
topic=api
topic=webdev
post request body
對於POST方法附加信息在body主體裏面當然也是經過編碼後的產物
客戶端cookie (client-side cookies)

response 狀態碼

當request發出以後服務器必須應答response
應答內容包含一個狀態碼（ HTTP Response status code）
歸納如下：

Informational responses (100–199)
臨時的響應這個不用管一般用不到
Successful responses (200–299)
意思你訪問成功了少年
Redirects (300–399)
一般就是重定向只不過重定向的原因各有不同
Client errors (400–499)
你客戶端的鍋（也可能服務器拒絕你給你甩鍋）
Server errors (500–599)
服務器的鍋

其中，常見的狀態碼有：

200 OK
成功訪問
302 FOUND
找到了只不過重定向了就好像你找你朋友（要找的資源），問你朋友的鄰居說，這個地址住着的人在哪？鄰居說你朋友換地方住了（新的地址），讓你去新地方找你朋友（重定向）
404 NOT FOUND
找不到服務器說找不到你想要的（其實也可能是服務器拒絕你訪問給你發好人卡）
503
服務器炸了

如果GET方法成功的話 response除了包含狀態碼還包含有請求到的資源requested resources
假設我們請求的是html頁面
當頁面中引用了.js .css的時候 html渲染（render）過程中，他會很機智的繼續分發（distribute）HTTP請求去下載這些.js .css 然後繼續完成整個網頁page的渲染.

GET request結構解析

GET請求到的資源會包含一個請求頭request header 和 響應頭response header
自然請求頭包含有有關請求的重要信息響應頭也是如此還有類似html header 網頁的head部分也是包含整個網頁的重要信息 header一直都很重要

我們可以打開任意一個網頁比如百度主頁www.baidu.com
然後F12 到Network 如之前所說我們可以看到一個個加載的文件
當然他們都是通過HTTP請求才能下載的意味着都有request和response 我們可以通過chrome查看：

Request URL: https://www.baidu.com/favicon.ico
Request Method: GET
Status Code: 200 OK
Remote Address: 182.61.200.6:443
Referrer Policy: unsafe-url

Accept: image/webp,image/apng,image/*,*/*;q=0.8
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9
Cache-Control: no-cache
Connection: keep-alive
Cookie: PSTM=1577329563; BAIDUID=E4F5FD18668074E8DED01C50FE983606:FG=1; BIDUPSID=0EA9375836717AE87969593B47FA41AD; BD_UPN=12314753; H_PS_PSSID=1442_21082; delPer=0; BD_CK_SAM=1; ZD_ENTRY=baidu; BD_HOME=0; PSINO=1; H_PS_645EC=657deZ3tp922DDbYImhUWOimcayt%2FhGQXfZibMkonRRi4b2vgCLKH7hyAz4
Host: www.baidu.com
Pragma: no-cache
Referer: https://www.baidu.com/
Sec-Fetch-Dest: image
Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: same-origin
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.87 Safari/537.36

這個部分也是爬蟲將會常常涉及到的爬蟲經常需要仿造表單主要是request header部分
好了我們來看看每個部分大概啥意思：
前三行：

Request URL: https://www.baidu.com/favicon.ico
這就是請求資源的資源地址我們可以看到是在百度服務器下的根目錄有個faviconi.ico
Request Method: GET 請求方式
Status Code: 200 OK HTPP狀態碼可見是正常訪問的
當然這個資源是不需要Query string 請求字符串的

其它內容包含有對服務器返回資源的限定：

Accept: image/webp,image/apng,image/,/*;q=0.8
限定返回圖片格式指定爲webp png等
Accept-Encoding: gzip, deflate, br
限定壓縮格式或者說可以接受的壓縮格式是gzip
Accept-Language: zh-CN,zh;q=0.9
限定接收語言中文

剩下的一些信息也至關重要比如：

Cache-Control: no-cache
無緩存模式
Connection: keep-alive
連接是一直alive的不是斷斷續續的那種（這個得學socket才懂）
Cookie: PSTM=1577329563; BAIDUID=E4F5FD18668074E8DED01C50FE983606:FG=1;
cookie我們常常聽說其實就是存一些客戶端的信息（可能包含賬號密碼所以說不安全）
Host: www.baidu.com
主機
Referer: https://www.baidu.com/
發request的地址也就是請求這個圖片的網頁地址（我們說過渲染的時候html會分發其他http請求來下載相關的文件譬如js css還有媒體文件如圖片音頻等）
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.87 Safari/537.36
說明你的瀏覽器信息這個是爬蟲最簡單也是最根本的——仿造UA 讓你的爬蟲被服務器誤認爲是用瀏覽器的普通用戶然後允許你訪問資源

另外這裏寫的有些內容content可能有時候放到了response header裏面不用在意

GET response解析

前面說了request header 這裏說說response
現在一般查到的可能是這個樣子的header：

有3各部分其實General部分包含了response header的內容（比如status code）當然我們一起看的問題不大
一般教科書式的response header長這樣：

HTTP/1.1 200 OK
Server: Apache
X-Backend-Server: developer1.webapp.scl3.mozilla.com
Vary: Accept,Cookie, Accept-Encoding
Content-Type: text/html; charset=utf-8
Date: Wed, 07 Sep 2016 00:11:31 GMT
Keep-Alive: timeout=5, max=999
Connection: Keep-Alive
X-Frame-Options: DENY
Allow: GET
X-Cache-Info: caching
Content-Length: 41823

HTTP/1.1 200 OK 狀態碼200 成功
Server: Apache apache服務器
Content-Type: text/html; charset=utf-8
返回內容說明：type text\html 然後字符集是utf-8
Date: Wed, 07 Sep 2016 00:11:31 GMT 標準GMT時間
Keep-Alive: timeout=5, max=999 keep-alive 具體參數 timeout等
-Connection: Keep-Alive
X-Frame-Options: DENY 禁止使用iframe嵌套
Allow: GET 允許GET獲取資源
X-Cache-Info: caching 允許緩存
Content-Length: 41823 返回長度
猜得出來這是網頁html的response header

POST request/response 解析

POST常常發生在你提交**表單（form）**的時候
比如你註冊CSDN 或者在政府的網站填寫免費領取口罩的個人信息啥的
這裏簡單起見兩個放在一起講：
request header （教科書實際情況也差不多）

POST https://developer.mozilla.org/en-US/profiles/hamishwillee/edit HTTP/1.1
Host: developer.mozilla.org
Connection: keep-alive
Content-Length: 432
Pragma: no-cache
Cache-Control: no-cache
Origin: https://developer.mozilla.org
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
Content-Type: application/x-www-form-urlencoded
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Referer: https://developer.mozilla.org/en-US/profiles/hamishwillee/edit
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.8,es;q=0.6
Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; _gat=1; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _ga=GA1.2.1688886003.1471911953; ffo=true

除了header 請求主體body內容如下：

csrfmiddlewaretoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT&user-username=hamishwillee&user-fullname=Hamish+Willee&user-title=&user-organization=&user-location=Australia&user-locale=en-US&user-timezone=Australia%2FMelbourne&user-irc_nickname=&user-interests=&user-expertise=&user-twitter_url=&user-stackoverflow_url=&user-linkedin_url=&user-mozillians_url=&user-facebook_url=

我們明顯看到GET 和POST的不同——POST的URL是不包含query string的
其他的都差不多的

有人會說：我們拿百度首頁測試發現貌似並不是這樣啊
——其實是因爲首頁並沒有任何查詢字段你沒輸入什麼來搜索啊
如果你輸入csdn 回車搜索就發現：

另外在請求主體我們可以拆解出一個個鍵值對——未加密的
這就是表單內容當然關鍵的內容是需要解密的

POST的response header也和GET差不多：

HTTP/1.1 302 FOUND
Server: Apache
X-Backend-Server: developer3.webapp.scl3.mozilla.com
Vary: Cookie
Vary: Accept-Encoding
Content-Type: text/html; charset=utf-8
Date: Wed, 07 Sep 2016 00:38:13 GMT
Location: https://developer.mozilla.org/en-US/profiles/hamishwillee
Keep-Alive: timeout=5, max=1000
Connection: Keep-Alive
X-Frame-Options: DENY
X-Cache-Info: not cacheable; request wasn't a GET or HEAD
Content-Length: 0

有點不太相同的：

status code = 302 FOUND
其實同200一樣是可用的——只不過多了重定向redirection
爲啥有重定向呢？
假設你登錄自己的主頁 POST提交·你的賬號密碼下一步就應當跳轉（重定向）到你的個人主頁了吧
重定向去哪個網頁呢？Location告訴你了

總結 ´◡`

這裏我們講述了有關response和request的相關信息是基礎的基礎——無論是建站還是爬蟲：）
下一站我們將討論靜態與動態網站的優劣還有一些細節。其實之前講到過一丁點，所以學起來問題不大
下面我們來了解一個有關動態網站的重要概念： AJAX
傳送：服務端編程（五）- 背景知識 - AJAX

服務端編程（四）- 背景知識 - request response 深入介紹

文章目錄

前言 ´･ᴗ･`

HTTP request

請求方法 request method

附加信息 addtional info

response 狀態碼

GET request結構解析

GET response解析

POST request/response 解析

總結 ´◡`

如何基於surging跨網關跨語言進行緩存降級

2024合集

程序員天天 CURD，怎麼才能成長，職業發展的思考(2)

移位操作搞定兩數之商

教你用Perl實現Smgp協議

如何通過前端表格控件在10分鐘內完成一張分組報表？

win11關閉自動檢測病毒刪文件

千兆寬帶實際網速能到達多少？

服務端編程（四）- 背景知識 - request response 深入介紹

服務端編程（二）- 背景知識 - web 客戶端服務端前端後端相關概念解析

服務端編程（五）- 背景知識 - AJAX

微機原理（一）補碼反碼符號與幅值符號拓展

服務端編程（八）- Django - admin 後臺管理站點後臺操作數據庫

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結