WebSocket事件和動作

WebSocket從客戶端初始化並與伺服器的連接以進行兩端之間的通信。要初始化連接，需要使用帶有遠程或本地伺服器的URL創建Javascript對象。

var socket = new WebSocket("ws://echo.websocket.org");

上面提到的URL是一個可用於測試和實驗的公共地址。websocket.org伺服器始終處於啟動狀態，並且在收到客戶端消息時並將其發送回客戶端。

下麵是確保應用程式正常運行的最重要步驟。

Websocket事件

有四個主要的Web Socket API事件 -

• 打開
• 消息
• 關閉
• 錯誤

每個事件都通過分別實現onopen，onmessage，onclose和onerror函數等函數來處理。它也可以在addEventListener方法的幫助下實現。

事件和函數的簡要概述如下 -

打開

當在客戶端和服務器之間建立了連接，就會從Web Socket實例觸發open事件。它稱為客戶端和服務器之間的初始握手。當建立連接就引發的事件被稱為onopen。

消息

通常在伺服器發送一些數據時發生消息事件。伺服器發送給客戶端的消息可以包括純文本消息，二進位數據或圖像。無論何時發送數據，都會觸發onmessage函數。

關閉

關閉事件標誌著伺服器和客戶端之間通信的結束。在onclose事件的幫助下，可以關閉連接。在onclose事件的幫助下標記通信結束後，伺服器和客戶端之間無法進一步傳輸消息。關閉事件也可能由於連接不良而發生。

錯誤

某些錯誤的錯誤標記，在通信期間發生。它是在onerror事件的幫助下標記的。在錯誤之後總是會終止連接。每個事件的詳細描述將在後面的章節中討論。

Web套接字操作

當事情發生時，通常會觸發事件。另一方面，當用戶想要發生某事時採取操作。通過用戶使用函數的顯式調用來執行操作。

Web Socket協議支持兩個主要操作，即 -

• send()
• close()

send()
對於與伺服器的某些通信，此操作通常是首選，包括發送包括文本檔，二進位數據或圖像的消息。

在send()操作的幫助下發送的聊天消息如下 -

// get text view and button for submitting the message
var textsend = document.getElementById(“text-view”);
var submitMsg = document.getElementById(“tsend-button”);

//Handling the click event
submitMsg.onclick = function ( ) {
   // Send the data
   socket.send( textsend.value);
}

注 - 只有在連接打開時才可以發送消息。

close()
這個方法代表握手再見，它完全終止連接，在重新建立連接之前不能傳輸任何數據。

var textsend = document.getElementById(“text-view”);
var buttonStop = document.getElementById(“stop-button”);

//Handling the click event
buttonStop.onclick = function ( ) {
   // Close the connection if open
   if (socket.readyState === WebSocket.OPEN){
      socket.close( );
   }
}

也可以借助以下代碼片段來關閉連接 -

socket.close(1000,"手動關閉連接...");