WebSocket 是一種資料通信協議，也是用于客戶端和服務端資料通信，類似于我們常見的 http
既然有 http，為啥還要 WebSocket
http 通信是單向的
請求 + 回應
沒有請求也就沒有回應
初次接觸 WebSocket 的人，都會問同樣的問題：我們已經有了 HTTP 協議，為什么還需要另一個協議？它能帶來什么好處？
答案很簡單，因為 HTTP 協議有一個缺陷：通信只能由客戶端發起，
舉例來說，我們想了解今天的天氣，只能是客戶端向服務器發出請求，服務器回傳查詢結果，HTTP 協議做不到服務器主動向客戶端推送資訊，
這種單向請求的特點，注定了如果服務器有連續的狀態變化，客戶端要獲知就非常麻煩，我們只能使用"輪詢"：每隔一段時候，就發出一個詢問，了解服務器有沒有新的資訊，最典型的場景就是聊天室，
輪詢的效率低，非常浪費資源（因為必須不停連接，或者 HTTP 連接始終打開），因此，工程師們一直在思考，有沒有更好的方法，WebSocket 就是這樣發明的，
WebSocket 協議在 2008 年誕生，2011 年成為國際標準，所有瀏覽器都已經支持了，
它的最大特點就是，服務器可以主動向客戶端推送資訊，客戶端也可以主動向服務器發送資訊，是真正的雙向平等對話，屬于服務器推送技術的一種，
簡單理解：
-
HTTP 打電話：
我問一句
你回答一句
沒有提問就沒有回答，即便對方主動給你說話，我也是個聾子聽不見 -
WebSocket 打電話：
雙向對話
HTTP 和 WebSocket 通信模型
其他特點包括：
（1）和 HTTP 一樣屬于應用層協議，也是建立在 TCP 協議之上，服務器端的實作比較容易，
（2）與 HTTP 協議有著良好的兼容性，默認埠也是 80 和 443，并且握手階段（第 1 次建立連接）采用 HTTP 協議，因此握手時不容易屏蔽，能通過各種 HTTP 代理服務器，
（3）資料格式比較輕量，性能開銷小，通信高效，
（4）可以發送文本，也可以發送二進制資料，
（5）沒有同源跨域限制，客戶端可以與任意服務器通信，
WebSocket 不是用來代替 HTTP 的，它是用來解決實時通信的業務場景，如果業務不需要實時性，那就沒必要使用 WebSocket，
WebSocket 也是有資源消耗的，因為它要實時通信，也是需要和服務端保持一定的通信連接，
WebSocket 也是需要服務端配合才能使用，
（6）協議識別符號是ws（如果加密，則為wss），服務器網址就是 URL，
（7）瀏覽器專門為 WebSocket 通信提供了一個請求物件 WebSocket
XmlHttPRequest 請求物件，發起 HTTP 協議請求
ws://example.com:80/some/path
http https
ws wss
使用原生 WebSocket（了解）
參考檔案：
MDN - WebSocket
瀏覽器為 HTTP 通信提供了 XMLHttpRequest 物件，同樣的，也為 WebSocket 通信提供了一個通信操作介面：WebSocket，
通信模型：
撥號（建立連接）
通話（雙向通信）
結束通話（關閉連接）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
// WebSocet 通信模型
// 1. 撥打電話（建立連接）
// 注意：wss://echo.websocket.org 是一個在線的測驗介面，僅用于 WebSocket 協議通信測驗使用
var ws = new WebSocket("wss://echo.websocket.org");
// 當連接建立成功，觸發 open 事件
ws.onopen = function(evt) {
console.log("建立連接成功 ...");
// 連接建立成功以后，就可以使用這個連接物件通信了
// send 方法發送資料
ws.send("Hello WebSockets!");
};
// 當接收到對方發送的訊息的時候，觸發 message 事件
// 我們可以通過回呼函式的 evt.data 獲取對方發送的資料內容
ws.onmessage = function(evt) {
console.log("接收到訊息: " + evt.data);
// 當不需要通信的時候，可以手動的關閉連接
// ws.close();
};
// 當連接斷開的時候觸發 close 事件
ws.onclose = function(evt) {
console.log("連接已關閉.");
}
</script>
</body>
</html>
怎么查看 WebSocket 請求日志?
朝上的綠色箭頭是發出去的訊息
朝下的紅色箭頭是收到的訊息
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/289832.html
標籤：其他
上一篇：基于CentOS7+Nginx+Daphne+uWSGI+Django3.2+supervisor+mysql8的服務器生產環境部署（一）