一、web socket事件和方法　

　　有了HTTP協議為什么還需要Websocket這種協議呢?因為HTTP協議發起的通信只能通過客戶端發起,然后服務端才可以將消息回應到客戶端。因此HTTP協議做不到服務器主動向客戶端推送信息。

　　Websocket是在單個TCP連接上進行全雙工通信的協議，允許服務端主動向客戶端推送數據。在 WebSocket API 中，瀏覽器和服務器只需要完成一次握手，兩者之間就直接可以創建持久性的連接，并進行雙向數據傳輸。

　　實際生產環境中實現推送技術所運用的大多都是Ajax輪詢。輪詢是在特定的的時間間隔，由瀏覽器對服務器發出HTTP請求，然后由服務器返回最新的數據給客戶端的瀏覽器。這種傳統的模式帶來很明顯的缺點，即瀏覽器需要不斷的向服務器發出請求，然而HTTP請求可能包含較長的頭部，其中真正有效的數據可能只是很小的一部分，顯然這樣會浪費很多的帶寬等資源。

簡單示例：

1 var ws = new WebSocket("wss://echo.websocket.org"); 2 3 ws.onopen = function(evt) { 4 console.log("Connection open ..."); 5 ws.send("Hello WebSockets!"); 6 }; 7 8 ws.onmessage = function(evt) { 9 console.log( "Received Message: " + evt.data); 10 ws.close(); 11 }; 12 13 ws.onclose = function(evt) { 14 console.log("Connection closed."); 15 };

大概執行步驟

1. 構造函數

　　WebSocket 對象作為一個構造函數，用于新建 WebSocket 實例。

var ws = new WebSocket('ws://localhost:8080');

執行上邊語句后，客戶端會與服務器進行連接。

2. Websocket.readstate

　　此屬性返回的是實例對象的當前狀態

1 CONNECTING : 值為0,表示正在連接 2 OPEN :值為1 ,表示連接成功,可以進行通信 3 CLOSING: 值為2,表示連接正在關閉. 4 CLOSED: 值為3 ,表示連接已經關閉,或者打開連接失敗

　　Java示例:

1 switch (ws.readyState) { 2 case WebSocket.CONNECTING: 3 // do something 4 break; 5 case WebSocket.OPEN: 6 // do something 7 break; 8 case WebSocket.CLOSING: 9 // do something 10 break; 11 case WebSocket.CLOSED: 12 // do something 13 break; 14 default: 15 // this never happens 16 break; 17 }

3.??webSocket.onopen(事件)

　　實例對象的onopen屬性，用于指定連接成功后的回調函數。

1 ws.onopen = function () { 2 ws.send('Hello Server!'); 3 }

　　如果要指定多個回調函數，可以使用addEventListener方法。

1 ws.addEventListener('open', function (event) { 2 ws.send('Hello Server!'); 3 });

4.?webSocket.onclose(事件)

　　實例對象的onclose屬性，用于指定連接關閉后的回調函數。

1 ws.onclose = function(event) { 2 var code = event.code; 3 var reason = event.reason; 4 var wasClean = event.wasClean; 5 // handle close event 6 }; 7 8 ws.addEventListener("close", function(event) { 9 var code = event.code; 10 var reason = event.reason; 11 var wasClean = event.wasClean; 12 // handle close event 13 });

5.?webSocket.onmessage(事件)

　　實例對象的onmessage屬性，用于指定收到服務器數據后的回調函數。

1 ws.onmessage = function(event) { 2 var data = event.data; 3 // 處理數據 4 }; 5 6 ws.addEventListener("message", function(event) { 7 var data = event.data; 8 // 處理數據 9 });

6. websocket.send(方法)

　　實例對象的send()方法用于向服務器發送數據

ws.send('your message');

7.?webSocket.bufferedAmount

　　實例對象的bufferedAmount屬性，表示還有多少字節的二進制數據沒有發送出去。它可以用來判斷發送是否結束。

1 var data = new ArrayBuffer(10000000); 2 socket.send(data); 3 4 if (socket.bufferedAmount === 0) { 5 // 發送完畢 6 } else { 7 // 發送還沒結束 8 }

8. websocket.onerror(事件)

　　實例對象的onerror屬性，用于指定報錯時的回調函數。

1 socket.onerror = function(event) { 2 // handle error event 3 }; 4 5 socket.addEventListener("error", function(event) { 6 // handle error event 7 });

二、Websocketed服務器

Websocketd

它的最大特點，就是后臺腳本不限語言，標準輸入（stdin）就是 WebSocket 的輸入，標準輸出（stdout）就是 WebSocket 的輸出。

舉例來說，下面是一個python腳本counter.py

1 print('1') 2 sleep 1 3 4 print('2') 5 sleep 1 6 7 print('3')

命令行下運行這個腳本，會輸出1、2、3，每個值之間間隔1秒。

1 2 3

現在，啟動websocketd，指定這個腳本作為服務。

$ websocketd --port=8080 python ./counter.py

上面的命令會啟動一個 WebSocket 服務器，端口是8080。每當客戶端連接這個服務器，就會執行counter.py腳本，并將它的輸出推送給客戶端

1 var ws = new WebSocket('ws://localhost:8080/'); 2 3 ws.onmessage = function(event) { 4 console.log(event.data); 5 };

上面是客戶端的 JavaScript 代碼，運行之后會在控制臺依次輸出1、2、3。

有了它，就可以很方便地將命令行的輸出，發給瀏覽器。

$ websocketd --port=8080 ls

上面的命令會執行ls命令，從而將當前目錄的內容，發給瀏覽器。使用這種方式實時監控服務器，簡直是輕而易舉（代碼）。

?

轉載于:https://www.cnblogs.com/a2534786642/p/11061700.html

總結

以上是生活随笔為你收集整理的04 Websocket和Websocketed的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。