什么是 WebSocket？
WebSocket 是一种基于 TCP 协议的全双工通信协议，它可以在浏览器和服务器之间建立持久连接，实现实时通信。相比于传统的 HTTP 协议，WebSocket 具有更低的延迟和更高的带宽利用率，适用于需要实时数据传输的场景。
为什么需要实时通信？
在 Web 应用中，有很多场景需要实时通信，比如即时聊天、实时协作、实时数据展示等。传统的 HTTP 协议是一种无状态协议，每次请求都需要重新建立连接，无法实现实时通信。而使用 WebSocket 可以在客户端和服务器之间建立持久连接，实现实时通信，从而提高用户体验和应用性能。
如何使用 WebSocket 实现 Express.js 实时通信？
在 Express.js 中，可以使用 ws 模块来实现 WebSocket 通信。具体步骤如下：
1. 安装 ws 模块
使用 npm 安装 ws 模块：
npm install ws --save
2. 创建 WebSocket 服务器
在 Express.js 应用中创建 WebSocket 服务器，代码如下：
// javascriptcn.com 代码示例
const express = require('express');
const app = express();
const WebSocket = require('ws');
const server = app.listen(3000, () => {
console.log('Server started on port 3000');
});
const wss = new WebSocket.Server({ server });
wss.on('connection', (ws) => {
console.log('WebSocket connected');
ws.on('message', (message) => {
console.log(`Received message: ${message}`);
ws.send(`Server received message: ${message}`);
});
ws.on('close', () => {
console.log('WebSocket disconnected');
});
});这段代码创建了一个 Express.js 应用，并在端口 3000 上启动了服务器。同时，创建了一个 WebSocket 服务器，监听客户端连接事件。当客户端连接到服务器时，会触发 connection 事件，并创建一个 WebSocket 实例。在 WebSocket 实例上监听 message 事件，当收到客户端发送的消息时，会在控制台输出消息内容，并通过 ws.send() 方法将消息发送回客户端。在 WebSocket 实例上监听 close 事件，当客户端断开连接时，会在控制台输出相应信息。
3. 创建 WebSocket 客户端
在客户端中创建 WebSocket 连接，代码如下：
// javascriptcn.com 代码示例
const ws = new WebSocket('ws://localhost:3000');
ws.onopen = () => {
console.log('WebSocket connected');
ws.send('Hello, server!');
};
ws.onmessage = (event) => {
console.log(`Received message: ${event.data}`);
};
ws.onclose = () => {
console.log('WebSocket disconnected');
};这段代码创建了一个 WebSocket 客户端，并连接到服务器地址 ws://localhost:3000。在 WebSocket 实例上监听 open 事件，当连接成功时，会在控制台输出相应信息，并通过 ws.send() 方法向服务器发送消息。在 WebSocket 实例上监听 message 事件，当收到服务器发送的消息时，会在控制台输出消息内容。在 WebSocket 实例上监听 close 事件，当与服务器断开连接时，会在控制台输出相应信息。
4. 测试实时通信
启动 Express.js 应用，并在浏览器中打开客户端页面，可以看到控制台输出相应信息。在客户端输入框中输入消息并发送，可以在服务端控制台和客户端控制台看到消息的收发情况，实现了实时通信。
总结
使用 WebSocket 可以在 Express.js 应用中实现实时通信，提高应用性能和用户体验。通过本文的介绍，你应该已经了解了如何使用 WebSocket 实现 Express.js 实时通信，并可以根据实际需求进行相应的开发和调试。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/657d4cded2f5e1655d81be45