前言
在 Web 开发过程中，有时候需要实时地在客户端和服务端之间传输数据，传统的方式是使用 Ajax 不断地轮询服务端，但这种方式不仅效率低下，还会占用大量的服务器资源。现在有了 WebSocket 技术，它通过一个长时间保持的连接，在客户端和服务端之间实现了双向的实时通信，这种方式不但效率高，而且资源占用少，用途非常广泛。
Socket.io 是一个面向实时 Web 应用的 JavaScript 库，它提供了基于 WebSocket 的双向通信功能。本文将详细介绍如何在 Express 中使用 Socket.io 来实现实时通信功能。
步骤
安装
在使用 Socket.io 之前，我们需要先安装它。使用 npm 命令行工具，在项目根目录下执行如下命令：
--- ------- ---------
配置
接下来，我们需要在 Express 中使用 Socket.io，需要进行如下配置：
引入
需要使用 Socket.io，需要在 Express 中引入它：
----- -- - ---------------------------------
该代码会创建一个 Socket.io 实例，并将 HTTP 服务器作为参数传入进去。
监听连接事件
当客户端连接到服务器时，Socket.io 会自动触发一个 connection 事件，我们需要监听这个事件，来处理这个连接：
------------------- ------ -- - -- ----- ---
在连接事件中，我们需要获取到连接的客户端，这个客户端是一个 Socket 实例，我们可以使用它来向客户端发送数据。
监听客户端事件
客户端和服务器之间可以双向通信，所以我们也需要为客户端创建监听事件：
----------------------- ---- -- - -- ----- ---
当客户端发送特定的事件时，服务器也可以进行一些操作。在 event_name 处填写要监听的事件名，在匿名函数中写入要进行的操作。
向客户端发送数据
当服务器需要向客户端发送数据时，它可以使用已连接的 Socket 实例。例如：
------------------------- ------
这样就可以向该连接传输特定事件和数据信息。该方法和客户端的事件监听方法类似。
向所有客户端广播数据
当服务器需要向所有客户端广播某个事件时，它可以使用 io 实例对所有的 Socket 连接进行广播：
--------------------- ------
这个方法将向所有已连接的客户端广播事件和数据信息。
示例代码
下面是一个完整的 Express + Socket.io 示例代码：
----- ---- - ----------------
----- ------- - -------------------
----- -------- - ---------------------
----- --- - ----------
----- ---------- - -----------------------
----- -- - ---------------------
------------------- ------ -- -
-------------- ------ -------------
----------------------- -- -- -
-------------- ------ ----------------
---
------------------------- --- -- -
--------------------- -------- ---------
---------------------------- -----
---
---
----------------------- -- -- -
------------------- ------- -- ---- --------
---说明：
connection事件：当有新的客户端连接时，会自动触发此事件。这里我们向控制台输出"A client connected."。disconnect事件：当有客户端断开连接时，会自动触发此事件。这里我们向控制台输出"A client disconnected."。send_message事件：当有客户端发送消息时，触发此事件，并将消息通过控制台输出和进行广播。broadcast_message事件：广播消息事件，用于向所有连接的客户端广播一条消息。
总结
使用 Socket.io 可以轻松实现 Web 应用中的实时通信，是非常实用的技术。在使用 Socket.io 前，请注意模块的安装和 Express 的配置。
在本文中，我们详细介绍了如何在 Express 中使用 Socket.io，包括安装、配置、事件监听和发送数据等步骤，并提供了示例代码。希望本文对读者有所帮助，欢迎交流和讨论。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6486e47748841e9894582e2a