在大部分 Web 应用中，个人与个人之间的信息传递成为常见的需求，而 WebSocket 技术可以实现实时通讯，轻松实现消息推送和接收功能。在本文中，我们将介绍如何使用 Express.js 框架来实现 WebSocket 的推送和接收。
基本概念
在介绍如何使用 Express.js 进行 WebSocket 实现前，我们首先需要了解一些 WebSocket 的基本概念。
WebSocket 是什么
WebSocket 是一种网络通信协议，其特点是在建立连接后，双方可以同时向对方发送和接收数据，而不受网络阻塞和 HTTP 请求的限制。这种实时通信方式在日常 Web 应用中比较常见，如在线聊天、直播等。
WebSocket 与 HTTP 的关系
HTTP 协议是基于请求/响应模型的，每次请求都需要重新建立连接。与此相比，WebSocket 是基于持久连接的。即客户端在建立连接后，服务器可以主动向客户端推送消息，而不需要等待客户端的请求。
使用 Express.js 进行 WebSocket 实现
在 Express.js 中，我们可以使用 express-ws 第三方库来实现 WebSocket 的推送和接收功能。下面我们将详细介绍如何使用 Express.js 进行 WebSocket 实现。
安装和引入依赖
首先，我们需要安装 express-ws 和 ws 两个依赖：
npm install express-ws ws --save
接着，在 Express.js 中引入 express-ws 中间件并创建 WebSocket 服务：
const express = require('express');
const expressWs = require('express-ws');
const app = express();
const expressWsInstance = expressWs(app);
const aWss = expressWsInstance.getWss();其中 app 是我们使用 express 函数创建的 Express.js 应用实例，expressWsInstance 是将其作为参数传入 express-ws 后得到的实例，aWss 用于存储 WebSocket 客户端连接后的实例。
监听 WebSocket 连接
在 Express.js 中，我们可以使用 app.ws 方法来监听 WebSocket 连接：
app.ws('/chat', (ws, req) => {
console.log('WebSocket client connected');
});其中 /chat 是 WebSocket 的地址，当 WebSocket 连接建立后，app.ws 回调函数中的 ws 参数即为 WebSocket 的实例，req 参数即为请求对象。
实现 WebSocket 推送和接收
在 WebSocket 连接建立后，我们可以通过 ws.send 方法向客户端推送消息：
ws.send('Hello, WebSocket!');而客户端接收到消息后，可以使用 WebSocket.onmessage 方法进行消息处理：
ws.onmessage = (event) => {
console.log(`WebSocket receive message: ${event.data}`);
};完整示例代码
下面是使用 Express.js 进行 WebSocket 推送和接收的完整示例代码：
-- -------------------- ---- -------
----- ------- - -------------------
----- --------- - ----------------------
----- --- - ----------
----- ----------------- - ---------------
----- ---- - ---------------------------
-- -- --------- --
--------------- ---- ---- -- -
---------------------- ------ ------------
-- ----
--------------- -------------
-- ----
------------ - ------- -- -
---------------------- ------- -------- ----------------
--
---
-- -----
----- ---- - ---------------- -- -----
---------------- ---------- -
---------------- -- --------- -- ---- -----------
---总结
在本文中，我们介绍了 WebSocket 的基本概念，并使用了 Express.js 框架和 express-ws 第三方库实现了 WebSocket 的推送和接收功能。使用 WebSocket 技术可以轻松实现实时通讯，满足日常 Web 应用中的聊天、直播等需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6522709d95b1f8cacd9e75ff