如何使用WebSocket發送和接收數據

WebSocket是一種允許通過保持服務器端和用戶端始終連接來進行雙向通信的技術，所以WebSocket既可以發送數據也可以接收數據，本篇文章我們就來看看如何使用WebSocket發送和接收數據。

我們先來看一下如何發送文本數據？

使用免費提供的http://echo.websocket.org作為樣本

具體示例如下

var connection = new WebSocket('wss://echo.websocket.org');

  

connection.send('樣本數據');

在此示例中，以看到正在創建WebSocket實例並使用send()方法發送數據。

但是，通常應該在任意時間傳輸數據。

因此，如果要通過單擊按鈕發送在表單中輸入的數據，可以按如下方式編寫。

btn.addEventListener('click', function(e) {

  var text = document.getElementById('text');

  

  connection.send(text.value);

})

在這個例子中，我們得到輸入表單的字符串並將其應用於send（）的參數。

這樣，您就可以發送任意文本數據。

如何接收文本數據？

這次使用的測試服務器的http://Echo.websocket.org將按原樣返回傳輸的數據。

代碼如下

connection.onmessage = function(e) {

    console.log(e.data);

};

我們使用onmessage()事件，該事件用於接收來自四種類型的事件處理的消息。

雖然這是一個簡單的描述，但僅此一項就可以接收從服務器返回的數據。

順便說一下，當你一起使用close()方法時，編碼如下

connection.onmessage = function(e) {

    console.log(e.data);

    connection.close();

};

在這種情況下，在收到數據后立即斷開通信。

此時，需注意的是如果close()斷開通信，除非再次與WebSocket建立連接，否則無法通信！

以上就是如何使用WebSocket發送和接收數據的詳細內容