本文介绍使用 Express.js 和 WebSocket 实现实时通讯的方法。WebSocket 是一种跨浏览器、跨平台的实时通讯协议，在前端开发中应用广泛。而 Express.js 是 Node.js 平台上的一个开放源代码、快速而简洁的 Web 应用程序框架，用于开发具有丰富功能的 Web 应用程序。
WebSocket 基础
WebSocket 协议是基于 HTTP 的，与 HTTP 头部交换数据来建立连接，建立后保持长连接，双方可以随时传输数据。其核心概念如下：
握手（Handshake）
Websocket 连接的建立是需要进行握手，例如以下 Websocket 握手的一个请求头：
--- ----- -------- ----- ------------------ -------- --------- ----------- ------- ------------------ ------------------------ ----------------------- ----- --------- ---------------------- -- ------- ------------------
服务器可以其中的头信息，来验证请求是否合法，同意建立连接。
帧（Frame）
WebSocket 通过帧来传输数据， 每个帧包含数据有效负载，后面可能跟着一些元数据。在发送数据时，将其划分为数据块，并使用帧来封装每个数据块。在接收数据时，解码缓存内对帧的数据块进行重新组装，并将该数据块移交给应用层。
数据（Data）
最初的数据传输由 UTF-8 编码的文本组成，但在其演化中还支持了各种形式的数据。不同的数据类型设置帧的元数据以确定如何（和应计算哪种类型的校验和）处理有效负载，随后典型的帧类型用于 ping-pong心跳检查同步。
WebSocket 在 Express.js 中的实现
Express 应用程序可以使用ws或socket.io等 WebSocket 库来实现 WebSocket 通讯。本文将使用ws库实现一个简单的 WebSocket 应用。
安装依赖
在命令行终端中，使用以下命令安装 ws 库：
--- ------- --
代码实现
以下是使用 ws 库实现的简单的 WebSocket 应用程序：
-- ----
----- ------- - -------------------
----- ---- - ----------------
----- --------- - --------------
-- -------
----- --- - ----------
----- ------ - -----------------------
----- --- - --- ------------------ ------ ---
-- --------- ------
-------------------- ---- -- -
------------------- ------------
---------------- --------- -- -
--------------------- ------- -- -------------
-- --------
--------------- --------- ------------ ------- -- -
-- ------- -
---------------------- ------ -----------
-
---
---
-------------- -- -- -
------------------- ---------------
---
---
-- -----
------------------- -- -- -
------------------- ------- -- ---- -------
---上面的代码使用 ws 库创建 WebSocket 服务器。当客户端连接到服务器时，服务器会广播消息。接收到来自客户端的消息时，服务器会对其进行回应。
测试应用
可以使用浏览器的控制台来测试 WebSocket 应用程序。打开浏览器，输入以下地址：
----------------------
在控制台中键入以下 JavaScript 代码：
----- ------ - --- --------------------------------- ------------------------------- ------- -- - ---------------------- ------------ ------------------- ------------- --- ---------------------------------- ------- -- - --------------------- -------- ---------------- --- -------------------------------- ------- -- - ---------------------- --------------- ---
以上代码通过 WebSocket 连接到服务器。连接成功后，它将在控制台中输出“WebSocket connected”。它还将发送“Hello, WebSocket!”消息到服务器。服务器会回复一条消息，然后您将在控制台中看到“Received message: Server response: Hello, WebSocket!”的消息。
结论
本文介绍了如何在 Express.js 中使用 WebSocket 实现实时通讯。了解了 WebSocket 基础和代码实现后，我们可以应用 WebSocket 技术实现更复杂的实时应用程序。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6728c3002e7021665e219be5