好程式設計師web前端教程JavaScript系列之HTTP
好程式設計師 web 前端教程 JavaScript 系列之 HTTP : http 是我們前後臺互動的時候的傳輸協議(即超文字傳輸協議)
HTTP 的工作流程
00001. 和伺服器建立連結
00002. 建立連結後,傳送一個請求給伺服器(請求)
00003. 伺服器接受到請求以後進行相應的處理並給出一個回應(響應)
00004. 斷開於伺服器的連結
和伺服器建立連結
· 怎麼和伺服器建立連結呢?
· 需要保證客戶端的接受和傳送正常,伺服器端的接受和傳送正常
· 這裡就涉及到一個東西叫做 TCP/IP 協議
· 建立連結的主要步驟叫做 三次握手
1、客戶端傳送一個訊息給到服務端
此時: 服務端知道了 客戶端可以正常傳送訊息 服務端知道了 服務端可以正常接受訊息
2、服務端回給客戶端一個訊息
此時:
服務端知道了 客戶端可以正常傳送訊息
服務端知道了 服務端可以正常接受訊息
客戶端知道了 客戶端可以正常傳送訊息
客戶端知道了 客戶端可以正常接受訊息
客戶端知道了 服務端可以正常接受訊息
客戶端知道了 服務端可以正常傳送訊息
3、客戶端再回給服務端一個訊息
此時:
服務端知道了 客戶端可以正常傳送訊息
服務端知道了 服務端可以正常接受訊息
客戶端知道了 客戶端可以正常傳送訊息
客戶端知道了 客戶端可以正常接受訊息
客戶端知道了 服務端可以正常接受訊息
客戶端知道了 服務端可以正常傳送訊息
服務端知道了 服務端可以正常傳送訊息
服務端知道了 客戶端可以正常接受訊息
· 至此,依照 TCP/IP 協議的建立連結就建立好了
· 雙方都知道雙方可以正常收發訊息
· 就可以進入到第二步,通訊了
傳送一個請求
· 建立完連結以後就是傳送請求的過程
· 我們的每一個請求都要把我們的所有資訊都包含請求
· 每一個請求都會有一個 請求報文
· 在 請求報文 中會包含我們所有的請求資訊(也就是我們要和服務端說的話都在裡面)
· 我們的請求報文中會包含幾個東西
1、請求行
POST /user HTTP/1.1
# POST 請求方式
# /user 請求URL(不包含域名)
# HTTP/1.1 請求協議版本
2、請求頭(請求頭都是鍵值對的形式出現的)
user-agent : Mozilla /5 . 0 # 產生請求的瀏覽器資訊 accept : application / json # 表示客戶端希望接受的資料型別 Content-Type : application / x-www-form-urlencoded # 客戶端傳送的實體資料格式 Host : 127 . 0 . 0 . 1 # 請求的主機名( IP )
3、請求空行(請求頭和請求主體之間要留一個空白行)
# 就是一個空行
4、請求體(本次請求攜帶的資料)
# GET 請求是沒有請求體資料的
# POST 請求才有請求體資料
· 接下來看一個完整的請求報文
POST /user HTTP/1.1 # 請求行
Host:
Content-Type: application/x-www-form-urlencoded
accept: application/json
User-agent: Mozilla/5.0. # 以上是首部
#(此處必須有一空行) # 空行分割header和請求內容
name=world # 請求體
接受一個響應
· 客戶端的請求傳送到服務端以後
· 服務端進行對應的處理
· 會給我們返回一個響應
· 每一個響應都會有一個 響應報文
· 在 響應報文 中會包含我們所有的響應資訊(也就是服務端在接受到客戶端請求以後,給我們的回信)
· 我們的 響應報文 中會包含幾個資訊
1、狀態行
HTTP/1.1 200 OK
# HTTP/1.1 伺服器使用的 HTTP 協議版本
# 200 響應狀態碼
# OK 對響應狀態碼的簡單解釋
2、響應頭
Date: Jan, 14 Aug 2019 12:42:30 GMT # 伺服器時間
Server: Apache/2.4.23 (Win32) OpenSSL/1.0.2j PHP/5.4.45 # 伺服器型別
Content-Type: text/html # 服務端給客戶端的資料型別
Content-Length: 11 # 服務端給客戶端的資料長度
3、響應體
hello world
# 服務端給客戶端的響應資料
斷開於服務端的連結
· 之前我們的建立連結是基於 TCP/IP 協議的 三次握手
· 我們的斷開連結是基於 TCP/IP 協議的 四次揮手
00001. 客戶端傳送一個我要斷開的訊息給服務端
00002. 服務端接受到以後傳送一個訊息告訴客戶端我已經進入關閉等待狀態
00003. 服務端再次傳送一個訊息告訴客戶端,這個是我的最後一次訊息給你,當我再接受到訊息的時候就會關閉
00004. 客戶端接受到服務端的訊息以後,告訴伺服器,我已經關閉,這個是給你的最後一個訊息
完成一個 HTTP 請求
· 至此,一個 HTTP 請求就完整的完成了
· 一個 HTTP 請求必須要包含的四個步驟就是
00001. 建立連結
00002. 傳送請求
00003. 接受響應
00004. 斷開連結
· 在一個 HTTP 請求中,請求的部分有請求報文,接受響應的部分有響應報文
· 請求報文包含
00001. 請求行
00002. 請求頭
00003. 請求空行
00004. 請求體
· 響應報文
00001. 狀態行
00002. 響應頭
00003. 響應體
常見的 HTTP 響應狀態碼
· 在一個 HTTP 請求的響應報文中的狀態行會有一個響應狀態碼
· 這個狀態碼是用來描述本次響應的狀態的
· 通常會出現五種狀態碼
00001. 100 ~ 199
00002. 200 ~ 299
00003. 300 ~ 399
00004. 400 ~ 499
00005. 500 ~ 599
100 ~ 199
· 一般我們看不到,因為表示請求繼續
· 100: 繼續請求,前面的一部分內容服務端已經接受到了,正在等待後續內容
· 101: 請求者已經準備切換協議,伺服器頁表示同意
200 ~ 299
· 2 開頭的都是表示成功,本次請求成功了,只不過不一樣的狀態碼有不一樣的含義(語義化)
· 200: 標準請求成功(一般表示服務端提供的是網頁)
· 201: 建立成功(一般是註冊的時候,表示新使用者資訊已經新增到資料庫)
· 203: 表示伺服器已經成功處理了請求,但是返回的資訊可能來自另一源
· 204: 服務端已經成功處理了請求,但是沒有任何資料返回
300 ~ 399
· 3 開頭也是成功的一種,但是一般表示重定向
· 301: 永久重定向
· 302: 臨時重定向
· 304: 使用的是快取的資料
· 305: 使用代理
400 ~ 499
· 4 開頭表示客戶端出現錯誤了
· 400: 請求的語法服務端不認識
· 401: 未授權(你要登入的網站需要授權登入)
· 403: 伺服器拒絕了你的請求
· 404: 伺服器找不到你請求的 URL
· 407: 你的代理沒有授權
· 408: 請求超時
· 410: 你請求的資料已經被服務端永久刪除
500 ~ 599
· 5 開頭的表示服務端出現了錯誤
· 500: 伺服器內部錯誤
· 503: 伺服器當前不可用(過載或者維護)
· 505: 請求的協議伺服器不支援
常見的 HTTP 請求方式
· 每一個 HTTP 請求在請求行裡面會有一個東西叫做請求方式
· 不同的請求方式代表的含義不同
00001. GET: 一般用於獲取一些資訊使用(獲取列表)
00002. POST: 一般用於傳送一些資料給服務端(登入)
00003. PUT: 一般用於傳送一些資料給服務當讓其新增新資料(註冊)
00004. DELETE: 一般用域刪除某些資料
00005. HEAD: 類似於 GET 的請求,只不過一般沒有響應的具體內容,用於獲取報文頭
00006. CONNECT: HTTP/1.1 中預留的方式,一般用於管道連結改變為代理的時候使用
00007. PATCH: 是和 PUT 方式類似的一個方式,一般用於更新區域性資料
00008. OPTIONS: 允許客戶端檢視服務端效能
· 我們比較常用的就是 GET 和 POST
GET 請求
· 引數以 querystring 的形式傳送,也就是直接拼接在 請求路徑的後面
· GET 請求會被瀏覽器主動快取
· GET 請求根據不同的瀏覽器對長度是有限制的
· IE: 2083 個字元
· FireFox: 65536 個字元
· Safari: 80000 個字元
· Opera: 190000 個字元
· Chrome: 8182 個字元
· APACHE(server): 理論上接受的最大長度是 8192 個字元(有待商榷)
· 對引數的型別有限制,只接受 ASCII 碼的格式
· GET 請求是明文傳送,相對不安全
POST 請求
· 引數以 request body 的形式傳送,也就是放在請求體中
· POST 請求不會被瀏覽器主動快取,除非手動設定
· POST 請求理論上是沒有限制的,除非服務端做了限制
· 對引數型別沒有限制,理論上可以傳遞任意資料型別,只不過要和請求頭對應
· POST 請求是密文傳送,相對安全
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69913864/viewspace-2689517/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 好程式設計師web前端教程分享前端javascript練習題之promise程式設計師Web前端JavaScriptPromise
- 好程式設計師web前端教程分享JavaScript面試題程式設計師Web前端JavaScript面試題
- 好程式設計師web前端教程分享javascript 練習題程式設計師Web前端JavaScript
- 好程式設計師web前端教程分享JavaScript簡寫方法程式設計師Web前端JavaScript
- 好程式設計師Web前端教程分享JavaScript開發技巧程式設計師Web前端JavaScript
- 好程式設計師web前端教程:字串程式設計師Web前端字串
- 好程式設計師web前端教程分享前端javascript練習題之閉包案例程式設計師Web前端JavaScript
- 好程式設計師web前端教程分享前端javascript練習題二程式設計師Web前端JavaScript
- 好程式設計師web前端教程分享前端javascript練習題三程式設計師Web前端JavaScript
- 好程式設計師web前端教程分享前端 javascript 練習題二程式設計師Web前端JavaScript
- 好程式設計師web前端系列之css3動畫程式設計師Web前端CSSS3動畫
- 好程式設計師web前端教程分javascript練習題-事件程式設計師Web前端JavaScript事件
- 好程式設計師web前端教程分享JavaScript Math(算數)物件程式設計師Web前端JavaScript物件
- 好程式設計師web前端教程分享JavaScript學習筆記之Event事件二程式設計師Web前端JavaScript筆記事件
- 好程式設計師web前端系列之CSS3-3D程式設計師Web前端CSSS33D
- 好程式設計師web前端之JavaScript陣列去重方法程式設計師Web前端JavaScript陣列
- 好程式設計師web前端教程之詳解JavaScript嚴格模式程式設計師Web前端JavaScript模式
- 好程式設計師web前端教程分享JavaScript的執行機制!程式設計師Web前端JavaScript
- 好程式設計師web前端教程分享前端javascript練習題Ajax封裝程式設計師Web前端JavaScript封裝
- 好程式設計師web前端教程:Math函式程式設計師Web前端函式
- 好程式設計師web前端教程分享CSS技巧!程式設計師Web前端CSS
- 好程式設計師web前端分享前端 javascript 練習題程式設計師Web前端JavaScript
- 好程式設計師web前端教程分享web前端基礎知識程式設計師Web前端
- 好程式設計師web前端教程分享js閉包程式設計師Web前端JS
- 好程式設計師web前端教程分享js模板模式程式設計師Web前端JS模式
- 好程式設計師web前端分享前端javascript練習題三程式設計師Web前端JavaScript
- 好程式設計師web前端分享前端javascript練習題一程式設計師Web前端JavaScript
- 好程式設計師前端教程-javascript的物件導向程式設計師前端JavaScript物件
- 好程式設計師web前端教程分享js reduce方法使用教程程式設計師Web前端JS
- 好程式設計師web前端學習路線之Javascript物件導向程式設計師Web前端JavaScript物件
- 好程式設計師web前端培訓分享JavaScript學習筆記之設計模式程式設計師Web前端JavaScript筆記設計模式
- 好程式設計師web前端培訓分享JavaScript框架J程式設計師Web前端JavaScript框架
- 好程式設計師web前端培訓分享學習JavaScript程式設計師Web前端JavaScript
- 好程式設計師分享Web前端知識之HTML程式設計師Web前端HTML
- 好程式設計師Web前端教程分享Vue學習心得程式設計師Web前端Vue
- 好程式設計師web前端教程之Node.Js流程程式設計師Web前端Node.js
- 好程式設計師web前端教程分享web前端入門基礎知識程式設計師Web前端
- 好程式設計師web前端教程分享web中CSS絕對定位程式設計師Web前端CSS