如何在 Node.js 中利用 WebSocket 进行双向通信-JavaScript中文网-JavaScript教程资源分享门户

WebSocket 是一种基于 TCP 协议实现的双向通信协议，它在客户端和服务器之间建立了一条持久连接，在一定程度上可以取代传统的轮询技术，实现更高效的实时通信。利用 Node.js 可以很方便地实现 WebSocket 通信，本文将着重介绍如何在 Node.js 中利用 WebSocket 进行双向通信。

WebSocket 的基本原理

在传统的 HTTP 协议中，客户端向服务器发送请求，服务器响应请求后立即关闭连接。这种模式对于实时通信并不友好，因为客户端需要反复向服务器发送请求，浪费带宽和资源。

WebSocket 出现的背景是为了解决这个问题。WebSocket 可以在客户端和服务器之间建立一条持久连接，客户端和服务器之间的通信消息可以直接在这条连接上进行，从而实现实时通信。

WebSocket 协议基于 TCP 协议。与传统的 HTTP 协议不同，WebSocket 协议通过一个类似 HTTP 的握手过程建立连接。建立连接后，双方可以直接发送和接收数据，而无需再次进行握手。

在 Node.js 中使用 WebSocket

Node.js 提供了多个支持 WebSocket 的库，如 ws、socket.io 等。本文将以 ws 库为例来介绍如何在 Node.js 中使用 WebSocket。

安装 `ws` 库

首先需要安装 ws 库，可以使用 npm 安装：

npm install ws --save

创建 WebSocket 服务器

在 Node.js 中创建 WebSocket 服务器很简单，只需要几行代码即可：

// javascriptcn.com 代码示例
const WebSocketServer = require('ws').Server;
const wss = new WebSocketServer({ port: 8080 });

wss.on('connection', function connection(ws) {
  console.log('WebSocket connection established');
  
  ws.on('message', function incoming(message) {
    console.log('received: %s', message);
  });

  ws.send('something');
});

上面的代码创建了一个 WebSocket 服务器，监听 8080 端口。当有客户端连接到服务器时，服务器会触发 connection 事件，回调函数中的 ws 是表示与客户端的 WebSocket 连接对象。

在回调函数中可以监听 message 事件，用于接收客户端发送的消息。当服务器需要向客户端发送消息时，可以使用 send 方法。上面的代码会向客户端发送一个字符串 'something'。

创建 WebSocket 客户端

在 Node.js 中创建 WebSocket 客户端也很简单，代码如下：

// javascriptcn.com 代码示例
const WebSocket = require('ws');
const ws = new WebSocket('ws://localhost:8080');

ws.on('open', function open() {
  console.log('WebSocket connection established');

  ws.send('something');
});

ws.on('message', function incoming(data) {
  console.log('received: %s', data);
});

上面的代码创建了一个 WebSocket 客户端，并连接到服务器的 8080 端口。当连接建立成功时，会触发 open 事件，可以在事件回调函数中发送消息。

在客户端中同样可以监听 message 事件，用于接收服务器发送的消息。

代码示例

下面是一个完整的实例，通过浏览器发送消息到 Node.js 服务器，服务器再将消息回显给浏览器。

服务器代码

// javascriptcn.com 代码示例
const http = require('http');
const WebSocket = require('ws');
const server = http.createServer();
const wss = new WebSocket.Server({ server });

wss.on('connection', function connection(ws) {
  console.log('WebSocket connection established');

  ws.on('message', function incoming(message) {
    console.log('received from client: %s', message);
    ws.send(`I received your message: ${message}`);
  });
});

server.listen(8080, function() {
  console.log('Server started on localhost:8080');
});

客户端代码

// javascriptcn.com 代码示例
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>WebSocket Example</title>
  </head>
  <body>
    <input type="text" id="message" /><button id="send">Send</button>
    <div id="output"></div>
    <script>
      const ws = new WebSocket('ws://localhost:8080');
      ws.onopen = () => console.log('Connected to server');
      ws.onmessage = evt => {
        console.log(evt.data);
        document.getElementById('output').appendChild(document.createTextNode(evt.data));
      };
      document.getElementById('send').onclick = () => {
        const message = document.getElementById('message').value;
        ws.send(message);
      };
    </script>
  </body>
</html>

总结

本文介绍了 WebSocket 的基本原理和在 Node.js 中使用 WebSocket 进行双向通信的方法。通过 ws 库可以方便地创建 WebSocket 服务器和客户端，实现实时通信。WebSocket 技术应用广泛，可以用于在线聊天、游戏、股票行情等应用场景。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/652be2a37d4982a6ebdbebcb

如何在 Node.js 中利用 WebSocket 进行双向通信