HTTP協議，到底是什麼鬼？

  • 2019 年 12 月 20 日
  • 筆記

作者 | Jeskson

來源 | 達達前端小酒館

了解HTTP

HTTP是什麼呢？它是超文本傳輸協議，HTTP是縮寫，它的全英文名是HyperText Transfer Protocol。

那麼什麼是超文本呢？

超文本指的是HTML，css，JavaScript和圖片等，HTTP的出現是為了接收和發佈HTML頁面的，經過不斷的發展也可以用於接收一些音頻，視頻，文件等內容。

HTTP協議是用於客戶端和服務器端之間的通信的，用於客戶端和服務器端之間的通信有HTTP協議和TCP/IP協議族內的其他眾多的協議相同。

請求訪問文本或圖片等資源的一方，我們叫做客戶端，接收端，提供響應的一端稱為服務器端。

Client客戶端請求Server服務端，Server服務端響應給Client客戶端。HTTP是基於客戶端/服務端的架構模型，瀏覽器或其他任何客戶端都可以用HTTP協議的，通過URL地址向HTTP的服務器即Web服務器發送所有請求，Web服務器端在接收到請求後會做出反應，響應給對方，就是向客戶端回傳響應的信息。

在這裡插入圖片描述

《圖解HTTP》

注意：在使用HTTP協議的時候，我們一端必定是客戶端，另一端必定是服務器端。

有時候服務端和客戶端是可以互換的，如果要決定誰是服務器端和誰是客戶端，單就一條通信路線來講，是可以確定的，因為由HTTP協議就是區分誰是客戶端，和誰是服務器端了。

通過發送信息（請求）和回應信息（響應）達成交易（通向）

通過請求和響應的交互達成通向，客戶端發送請求給服務器，服務器響應回復給客戶端。客戶端是發出請求的，服務器端是回復響應的。

先是從客戶端開始建立通信的，因為在服務器在沒有接受到請求前是不會發送響應的。

HTTP的特點：

支持客戶端、服務器端模式，簡單快速，客戶端向服務器端請求服務時，只需傳送請求方法和路徑，靈活，HTTP允許傳輸任意類型的數據對象，無連接，限制每次連接只處理一個請求，無狀態，HTTP協議是無狀態協議，指明協議對於事務處理沒有記憶能力。

HTTP都是由客戶端發起請求的，並且由服務器端回應響應消息的。

靈活，我們知道允許可以任何類型的數據對象，包括音頻，視頻，圖片，文件等等。

無狀態，HTTP就是說，每次HTTP請求都是獨立的，任何兩個請求之間沒有必然的聯繫。

無連接的，每次服務器在處理完客戶端的請求後，並收到客戶的應答後，就斷開了，當客戶端再次發送請求時就是一個新的連接，採用這種方式可以節省傳輸時間。

這是HTTP/1.0版的主要缺點，每個TCP連接只能發送一個請求，發送數據完畢，連接就關閉，如果還要請求就必須要新建一個連接。

HTTP是一種不保存狀態，無狀態協議，協議對於發送過來的請求或是響應都不做持久化處理。

HTTP1.1雖然是無狀態協議，但是為了實現期望的保持狀態功能，於是引入了Cookie技術，有了Cookie，和HTTP協議通信，就可以管理狀態了。

在這裡插入圖片描述

在這裡插入圖片描述

TCP連接的新建成本很高，因為需要客戶端和服務器端三次握手。

交流的簡單流程：客戶端發起連接，客戶端發起請求，服務器端響應請求，服務器端關閉連接。

HTTP、1.1版本是最流行的版本，可以持久連接，TCP連接默認不關閉，可以被多個請求復用，只有在一段時間內，沒有請求，就可以自動關閉。

// 不用聲明：  Connection: keep-alive    // 發送關閉  Connection: close  // 要求服務器關閉TCP連接

HTTP的消息結構

我們可以把HTTP協議當做是一種客戶端和服務器端相互溝通交流的語言，一個HTTP客戶端在向服務器發送請求時會攜帶請求的消息，服務器端會根據客戶端發送過來的請求消息了解客戶端的需求，從而服務器端做出響應，發送響應消息給客戶端。

請求消息的結構：

一個請求消息是由請求行，請求頭字段，一個空行和消息主體構成。

消息主體是響應消息的承載數據。

客戶端：發送請求

客戶端發送給某個HTTP服務器端的請求報文中的內容

GET/HTTP/1.1  Host: hackr.jp

服務器：發送響應

HTTP/1.1 200 OK  Date: Tue, 10 Jul ...  Content.Length: 362  Content.Type: text/html  <html>

**加粗樣式**

GET，Request Method，請求方法，Request URL，為請求的url的地址，Status Code為狀態碼，Remote Address為地址。

HTTP是基於TCP/IP協議的應用層協議，不涉及數據包傳輸，規定了客戶端和服務器端之間的通信方式，默認使用80端口，就如同他倆交流的語言。

HTTP1.0的發佈，任何格式的內容都可以發送了，不僅可以發送文件，圖片，視頻，二進制文件等。

HTTP發送請求的例子：

在這裡插入圖片描述

服務器回應消息格式：

在這裡插入圖片描述

響應頭：

Server為服務器的名稱，Location為通知客戶端新的資源位置，Content-Type響應數據的類型，Content-Encoding為響應數據的編碼格式。

在這裡插入圖片描述

頭部信息回應的是ASCII碼，後面的數據可以是任何形式，服務器返回信息的時候，告訴客戶端數據是什麼格式的，由Content-Type字段體現。

Content-Type的字段值：

text/plain  text/html  text/css  image/jpeg  // 上面的圖片返回的是  image/png  image/svg+xml  audio/mp4  video/mp4  application/javascript  application/pdf  application/zip  application/atom+xml

在這裡插入圖片描述

分析一下就是，協議版本，狀態碼，狀態描述。

在尾部使用分號，添加參數，類型表示，發送的是網頁，編碼為utf-8

Content-Type: text/html; charset=utf-8

Accept字段聲明自己可以接受哪些數據格式：

Accept: */*

請求消息：

在這裡插入圖片描述

GET /index.htm HTTP/1.1  User-Agent: Mozilla/4.0 (compatible; MSIE5.01; Windows NT)  Host: example.com  Accept-Language: en-us  Accept-Encoding: gzip, deflate

Accept為客戶端接受哪些Mine類型，Accept-Encoding支持的編碼類型，Accept-Language為可接受的語言，User-Agent為一個標識客戶端的字符串。

字符串index.htm指明了請求訪問的資源對象，也叫做請求URL，後面的是HTTP/1.1，為HTTP版本號，表示客戶端使用的HTTP版本協議。

URL為請求的URL地址，協議版本為代表在向服務器發送請求時，使用的協議以及其版本，請求頭部為HTTP請求頭部包含若干個屬性，格式：

「屬性名」：「屬性值」，服務器端可以據此獲取客戶端請求的相關信息。

客戶端請求用Accept-Encoding字段說明自己可以接受哪些壓縮方式

Accept-Encoding: gzip, deflate

請求行為請求消息的第一行，它說明了請求方法，資源標示符，HTTP版本，如下：

請求URI定位資源：HTTP協議使用URI定位互聯網上的資源。

在這裡插入圖片描述

《圖解HTTP》

URI,URL,URN是用來識別，定位和命名互聯網上的資源的。

在這裡插入圖片描述

在這裡插入圖片描述

在這裡插入圖片描述

URI：    Uniform Resource Identifier，統一資源標識符    URL：    Uniform Resource Locator，統一資源定位符    URN：    Uniform Resource Name，統一資源名稱

在這裡插入圖片描述

在這裡插入圖片描述

由HTTP版本，狀態碼，狀態描述文字構成：

HTTP/1.1 200 OK
GET /hello.htm HTTP/1.1  請求訪問某台HTTP服務器上的index.htm頁面資源

請求報文是由請求方法，請求URL，協議版本，可選的請求首部字段和內容實體構成的。

請求報文的解構

消息報頭

在這裡插入圖片描述

在這裡插入圖片描述

響應報文由協議版本，狀態碼，響應的首部字段，以及實體主體構成。

讓我們了解在HTTP/1.1有多少中請求方法：

HTTP的請求方法有很多，但是最常見的兩種請求方法是GET和POST

提交HTML表單或上傳文件

在這裡插入圖片描述

《圖解HTTP》

在這裡插入圖片描述

《圖解HTTP》

POST：傳輸實體主體 POST 方法用來傳輸實體的主體。

在這裡插入圖片描述

《圖解HTTP》

PUT：傳輸文件 PUT 方法用來傳輸文件。

在這裡插入圖片描述

《圖解HTTP》

HEAD：獲得報文首部 DELETE 方法用來刪除文件，是與 PUT 相反的方法。

OPTIONS：詢問支持的方法 OPTIONS 方法用來查詢針對請求 URI 指定的資源支持的方法。

1.GET為獲取資源數據  get方法用於請求指定的頁面信息，並返回請求消息的主體    2.POST為提交資源數據  post方法用於向指定的資源提交數據    3.PUT為更新資源數據  4.DELETE為刪除資源數據  5.HEAD為讀取資源的元數據  6.OPTIONS為讀取資源多支持的所有請求方法  7.TRACE為回顯服務器收到額請求  8.CONNECT為保留將來使用

HTTP超文本傳輸協議是一個基於請求與響應模式的，無狀態的，應用層的協議，常基於TCP的連接方式。HTTP表示通過HTTP協議定位網絡資源，host表示合法的Internet主機域名或者ip地址，port指定為端口號。

第一行：方法，URL，協議版本 第二行：請求首部字段 第三行：內容實體

客戶端的請求消息：

請求方法，URL，協議版本為請求行，請求頭部，頭部字段名，值，請求數據，一個HTTP請求的請求消息包括請求行，請求頭部，空行和請求數據。

服務器端響應消息：

狀態行，消息報頭，空行，響應正文，這是一個HTTP響應的響應消息。

狀態行，HTTP/1.1為表示使用的協議是HTTP的版本，我們可以看到狀態碼常見返回「200 0k」代表是服務器成功響應了此次請求，消息報頭，與HTTP請求頭部一樣，格式為「屬性名:屬性值"，客戶端可以根據此獲取服務器端響應的信息，響應正文是服務器返迴響應的東西給到客戶端，也是客戶端想要的東西。

超文本傳輸協議（英文：HyperText Transfer Protocol，縮寫：HTTP）是互聯網上應用最為廣泛的一種網絡協 議。設計HTTP最初的目的是為了提供一種發佈和接收HTML頁面的方法。通過HTTP或者HTTPS協議請求的資源由 統一資源標識符（Uniform Resource Identifiers，URI）來標識。 來自維基百科

HTTP狀態碼（英語：HTTP Status Code）是用以表示網頁服務器HTTP響應狀態的3位數字代碼。它由RFC 2616規範定義的，並得到RFC 2518、RFC 2817、RFC 2295、RFC 2774、RFC 4918等規範擴展。來自維基百科

HTTP狀態碼

HTTP狀態碼是用來幹什麼的呢？它的重要作用是Web服務器用來告訴客戶端，當前的網頁請求發生什麼事情了，或者是當前web服務器端的響應狀態，HTTP狀態碼是服務器端返回給客戶端的。

你比較常見的狀態碼有哪些呢？

有200,301,302,304,404,500,403。

我們最常見的狀態碼為200，狀態碼200表示服務器響應成功，服務器找到了客戶端請求的內容，並將內容發送給了客戶端。

我們程序員有時候也常見的500，狀態碼500表示程序錯誤，就是說請求的網頁程序本身就報錯了。

現在的瀏覽器會對狀態碼500做出一定的處理，所以在一般情況下會返回一個定製的錯誤頁面。

狀態碼404表示服務器上沒有該資源，或者說是服務器上沒有找到客戶端請求的資源，是最常見的請求錯誤碼。

狀態碼301和狀態碼302

狀態碼301表示臨時跳轉。

url地址a可以向url地址b上跳轉，但這並不意味着是永久性的，有可能過短時間就從url地址a跳轉到地址c。

而狀態碼302代表的是永久性的重定向。

在這裡插入圖片描述

2xx:

200為請求已經成功，202為服務器已經接受請求，但尚未處理，204為服務器成功處理了請求，但不需要返回如何實體內容。

304為被請求的資源內容沒有發生更改。

400為包含語法錯誤，無法被服務器解析，403為服務器已經接收請求，但是被拒絕執行，404請求失敗。

500為服務器內部錯誤，無法處理請求，502為作為網關或者代理工作的服務器嘗試執行請求時，從上游服務器接收到無效響應，504為作為網關或者代理工作的服務器嘗試執行請求時，未能及時從上游服務器（URI標識出的服務器，例如HTTP、FTP、LDAP）或者輔助服務器（例如DNS）收到響應

200 OK 請求被正確處理

302 Found 所請求的資源已暫時更改.通常會重定向到另一個 URL

404 Not Found 所請求的資源無法找到

500 Internal Server Error 服務器出現一般性錯誤

HTTP通信過程

本地服務器編寫一個demo.html文檔：

<!DOCTYPE html>  <html>   <head>    <meta charset="UTF-8">    <title>Document</title>    <script type="text/javsscript" src="/js/jquery.js">    </script>   </head>   <body>   <img src="/images/01.jpg"><br>   </body>  </html>

消息頭是在客戶端發送請求時，向服務器傳輸的信息。

Accept為告訴服務器接收哪些格式的文件，Accept-Encoding為接收的編碼方式，Accept-Language為接收的語言，Cache-Control為是否使用緩存，Connection為連接方式，Cookie為向服務器發送的Cookie信息，Host為服務器域名。

Content-Length為服務器返回給客戶端的內容的長度，Content-Type為服務器返回給客戶端的內容的類型，Keep-Alive為緩存的時間，Server為服務器的相關信息。

HTTP過程中包含3個重要部分，消息頭，響應頭和狀態碼。

消息頭中存放的信息是客戶端告訴服務器能回傳什麼，就是客戶端能接收的信息是什麼類型的，如果客戶端需要傳值，則傳值信息也會放在消息頭中。

響應頭中存放的信息是服務器告訴客戶端返回的內容相關信息，包括回傳內容的長度，內容和緩存的時間等。

狀態碼為服務器告訴客戶端它的響應結果是什麼。

其他

打開Chrome，在菜單中選擇「視圖」，「開發者」，「開發者工具」：

Elements顯示網頁的結構，Network顯示瀏覽器和服務器的通信。Content-Type指示響應的內容，這裡是text/html表示HTML網頁。

HTTP的消息分為兩種，請求和響應。

// 一個 簡單的HTTP請求：  GET / HTTP/1.1  Host: example.com  Connection: close
HTTP/1.1 200 OK  Content-Type: text/plain; charset=utf-8  Content-Length: 8    response

HTTP消息由三部分組成，首行，消息頭和消息體。消息頭和消息體均可以為空。

請求行

請求行由三部分組成，分別是方法(GET)，URI(/)和http版本(HTTP/1.1)

GET / HTTP/1.1

消息頭

消息頭host用於指定所請求的域名。

請求消息包括以下格式：

在這裡插入圖片描述

在這裡插入圖片描述

更多狀態碼： https://www.runoob.com/http/http-status-codes.html

在這裡插入圖片描述

在這裡插入圖片描述

HTTP工作原理

在這裡插入圖片描述

參考資料

http://yuez.me/http-xie-yi-jie-xi/

《圖解HTTP》

作者Info：

【作者】：Jeskson 【原創公眾號】：達達前端小酒館。 【轉載說明】：轉載請說明出處，謝謝合作！~

大前端開發，定位前端開發技術棧博客，PHP後台知識點，web全棧技術領域，數據結構與算法、網絡原理等通俗易懂的呈現給小夥伴。謝謝支持，承蒙厚愛！！！

VirMach 便宜 VPS

QNews

QNews