近年来，随着 Web 技术的不断发展，WebSocket 的应用越来越普及。WebSocket 是一种双向通信协议，它可以让客户端和服务器之间建立一个持久的连接，从而实现实时通信。在前端开发中，WebSocket 可以用于实现即时聊天、实时监控等功能。
Express.js 是一款基于 Node.js 的 Web 框架，它提供了方便的路由和中间件，可以快速地搭建 Web 应用。本文将介绍在 Express.js 中实现 WebSocket 通信的方法及最佳实践。
WebSocket 的基本原理
在介绍 Express.js 中的 WebSocket 实现方法之前，先来了解一下 WebSocket 的基本原理。
WebSocket 使用了一种新的 HTTP 协议进行通信，但是它并不像普通的 HTTP 协议那样只支持单向通信。WebSocket 在客户端和服务器之间建立一个持久的连接，双方都可以随时向对方发送消息。
WebSocket 的通信流程如下图所示：
-- -------------------- ---- ------- --- --- - - ------ ------ -------- - - ------- -- --- --- ----- - - ------ ---- ------------ - - ------- ---- ----------- - - ------ ---- ------------ - - ------- --------- ---
在连接建立之后，客户端和服务器可以随时向对方发送消息。客户端不需要等待服务器的响应，而是可以自行决定何时发送消息。
Express.js 中的 WebSocket 实现方法
在 Express.js 中实现 WebSocket 通信，需要用到一个第三方模块 ws。ws 是一个 WebSocket 实现模块，可以在 Node.js 环境下运行。
下面我们来看一个简单的 Express.js 与 WebSocket 结合使用的示例：
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------
----- ---- - ----------------------------------
----- --------- - --------------
----- --- - --- ------------------ ------- ---- ---
-------------------- -------- -- -
------------------- ------------
-- ------------
-------------------- --------- -- -
--------------------- ---------- ---------
-- -----------
---------------------------- -- -
-- ------------------ --- --------------- -
---------------------
-
---
---
---
----------------- -- -- -
---------------------- -- ---------
---上述代码中，我们使用了 ws 模块创建了一个 WebSocket 服务器，然后在服务器收到客户端连接的事件 connection 中监听客户端发送的消息事件 message，再通过 wss.clients 遍历所有客户端，将收到的消息发送给每个客户端。
以上面的代码为基础，我们可以实现一些常见的功能，比如实现一个简单的聊天室，让多个用户之间可以实时发送消息。
最佳实践
在使用 Express.js 实现 WebSocket 通信时，有一些最佳实践值得注意：
精简代码逻辑。在
ws.on('connection')的回调中监听socket.on('message')的事件，再遍历每个连接发送消息的代码可以作为通用的逻辑进行复用。使用 JSON 格式传输数据。由于 WebSocket 可以支持复杂的数据类型，包括二进制数据，在实际使用时可能会比较复杂。推荐使用 JSON 格式传输数据，以简化代码逻辑。
限制连接数。过多的连接会大大影响服务器的性能。建议为了更好地限制连接数，可以使用第三方库
ws-rate-limiter-flexible。
总结
通过本文的介绍，我们学习了在 Express.js 中实现 WebSocket 通信的方法及最佳实践。WebSocket 是一个非常有用的协议，可以用于实现实时通信。在使用时需要注意性能和数据格式，以保证功能的稳定和可靠。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ec31e2f6b2d6eab36760f0