如何使用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發送和接收數據的詳細內容