淺析WebSocket 原理
淺析WebSocket 原理
長恨此身非我有,何時忘卻營營。
簡介:先簡單了解下WebSocket 原理,日後的使用中再進一步深入研究~
一、什麼是WebSocket
WebSocket 是HTML5 開始提供的一種在單個TCP 連接上進行全雙工通訊的協議,其最大特點就是,服務器可以主動向客戶端推送信息,客戶端也可以主動向服務器發送信息,屬於雙向平等對話。更深層次的解釋就是WebSocket 是應用層第七層上的一個應用層協議,它必須依賴 HTTP 協議進行一次握手 ,握手成功後,數據就直接從 TCP 通道傳輸,與 HTTP 無關了。也就是說WebSocket 分為握手和數據傳輸階段,即進行了HTTP握手 + 雙工的TCP連接,當然還有關閉連接。
二、WebSocket 應用場景
1、直播發彈幕、身份認證。
2、社交訂閱。
3、多玩家遊戲。
4、協通編輯/編程。
5、點擊流數據。
6、股票基金報價。
7、體育實況更新。
8、多媒體聊天。
9、基於位置的應用。
10、在線教育等。
三、WebSocket 特點
-
建立在 TCP 協議之上,服務器端的實現比較容易。
-
與 HTTP 協議有着良好的兼容性。默認端口也是80和443,並且握手階段採用 HTTP 協議,因此握手時不容易屏蔽,能通過各種 HTTP 代理服務器。
-
數據格式比較輕量,性能開銷小,通信高效。
-
可以發送文本,也可以發送二進制數據。
-
沒有同源限制,客戶端可以與任意服務器通信。
-
協議標識符是ws(如果加密,則為wss),服務器網址就是 URL。
四、WebSocket 協議內容
WebSocket 最新的協議是 13 RFC 6455。協議主要包括兩個部分,一個是握手的規則,另一個是數據傳輸的方式及載體格式。
WS連接生命周期
五、握手階段
因為 WebSocket 是基於 HTTP 協議的,它借用了 HTTP 協議來完成一部分握手。
所以,握手階段WebSocket 首先發起一個 HTTP 請求,在請求頭加上 Upgrade 字段,該字段用於改變 HTTP 協議版本或者是換用其他協議,把 Upgrade 的值設為 websocket ,即將它升級為 WebSocket 協議。
一個典型的 WebSocket 握手:
1 GET /chat HTTP/1.1
2 Host: server.example.com
3 Upgrade: websocket
4 Connection: Upgrade
5 Sec-WebSocket-Key: x3JJHMbDL1EzLkh9GBhXDw==
6 Sec-WebSocket-Protocol: chat, superchat
7 Sec-WebSocket-Version: 13
8 Origin: //example.com
熟悉 HTTP 的一眼就可以看出這段類似 HTTP 協議的握手請求中,多了Upgrade、Connection、Sec-WebSocket-Key、Sec-WebSocket-Protocol、Sec-WebSocket-Version 幾個屬性。
1 Upgrade: websocket
2 Connection: Upgrade
這幾個屬性就是 WebSocket 的核心了,Upgrade:websocket屬性通知 Apache 、 Nginx 等服務器,此次發起的請求要用 WebSocket 協議,而不是http。
1 Sec-WebSocket-Key: x3JJHMbDL1EzLkh9GBhXDw==
2 Sec-WebSocket-Protocol: chat, superchat
3 Sec-WebSocket-Version: 13
Sec-WebSocket-Key 字段,它由客戶端生成並發給服務端,用於證明服務端接收到的是一個可受信的連接握手,可以幫助服務端排除自身接收到的由非 WebSocket 客戶端發起的連接,該值是一串隨機經過 base64 編碼的字符串。即該字段用於驗證服務器端是否採用WebSocket 協議。
收到請求後,服務端做一次響應:
1 HTTP/1.1 101 Switching Protocols
2 Upgrade: websocket
3 Connection: Upgrade
4 Sec-WebSocket-Accept: HSmrc0sMlYUkAGmm5OPpG2HaGWk=
5 Sec-WebSocket-Protocol: chat
響應裏面重要的是 Sec-WebSocket-Accept ,服務端通過從客戶端請求頭中讀取 Sec-WebSocket-Key 與一串全局唯一的標識字符串(俗稱魔串)「258EAFA5-E914-47DA- 95CA-C5AB0DC85B11」做拼接,生成長度為160位的 SHA-1 字符串,然後進行 base64 編碼,作為 Sec-WebSocket-Accept 的值回傳給客戶端。
此時成功建立了WebSocket 連接,Upgrade:websocket 字段也標誌着這裡開始就是 HTTP 最後負責的區域了,通知客戶端服務端已切換為WebSocket 協議。至此,HTTP 已經完成它所有工作了,接下來就是完全按照 WebSocket 協議進行了。
六、數據傳輸階段
Websocket 的數據傳輸是以frame 形式傳輸的,比如將一條消息分為幾個frame,按照先後順序傳輸出去。這樣做會有幾個好處:
- 1、大數據的傳輸可以分片傳輸,不用考慮到數據大小導致的長度標誌位不足夠的情況。
- 2、和http 的chunk 一樣,可以邊生成數據邊傳遞消息,極大提高了傳輸效率。
websocket傳輸協議圖
吃透WebSocket 傳輸協議圖請聽下回分解~
七、WebSocket 初體驗
後端使用SpringBoot,前端使用VUE,通過WebSocket 實現後端發送訊息,前端接收到訊息後即刻播放聲音提示。
長恨此身非我有
何時忘卻營營