引言
在前端开发中，有时需要实现多人实时协作的功能，例如在线游戏、聊天室等。这些功能需要借助服务器和客户端之间的双向通信技术来实现。常见的通信协议有 WebSocket 和 Socket.io，其中 Socket.io 是对 WebSocket 的封装，并提供了更加方便的 API，同时支持多种传输方式，例如 WebSocket、HTTP 长轮询等。本文将介绍如何使用 Socket.io 在 Express 中实现多人实时协作。
准备工作
在开始本文之前，需要安装 Node.js 和 npm。可以通过以下命令进行检查：
node -v npm -v
如果返回版本号，则说明已经安装成功。
接下来，通过 npm 安装 express 和 socket.io：
npm install express npm install socket.io
实现方法
首先，需要在 Node.js 服务端启动 express，并监听端口。可以使用以下代码创建 index.js 文件：
-- -------------------- ---- -------
----- ------- - ------------------
----- --- - ---------
----- ------ - ---------------------------------
----- -- - ----------------------------
----- ---- - ---------------- -- ----
------------ ----- ---- -- -
---------------------- - --------------
--
------------------- -------- -- -
----------------- -----------
-------------------- ------ -- -
------------------ -----
--
----------------------- -- -- -
----------------- --------------
--
--
------------------- -- -- -
------------------- --------- -- ---- ---------
--该代码创建了一个 Express 应用，并监听 3000 端口。同时，创建了一个 Socket.io 对象，并监听了 connection 事件。当有新的连接时，会输出 User connected。该代码还实现了接收来自客户端的 message 事件，并通过 io.emit('message', data) 向所有客户端发送消息。当客户端断开连接时，会输出 User disconnected。
接下来，创建一个 index.html 文件，其中包含一个聊天输入框和一段 JavaScript 代码，用于与 Socket.io 建立连接并监听消息。
-- -------------------- ---- -------
--------- -----
------
------
---------------- ------------
-------
------
------ ------------------ ----------- ----------------- ---- ---------
------- ---------------------------
------- ---------------------------------------
--------
----- ------ - ----
----- ------------ - ----------------------------------------
----- ------- - -----------------------------------
--------------------------------- -- -- -
----- ------- - ------------------
-- --------- -
---------------------- --------
------------------ - --
-
--
-------------------- ------ -- -
-----------------
--
---------
-------
-------该文件使用 socket.io.js 脚本，通过 io() 方法创建了一个 Socket.io 实例，并监听了 message 事件。当用户输入消息并点击发送按钮时，会通过 socket.emit('message', message) 发送消息。当收到服务器的消息时，会在控制台打印出来。
通过以上代码，已经可以实现一个简单的在线聊天室了。当用户发送消息时，所有用户都会接收到该消息。
指导意义
通过以上代码，总结以下几点指导意义：
- 在 Express 中使用 Socket.io 需要先创建一个 http 服务，并把它作为参数传给 Socket.io 构造函数。
- Socket.io 提供了多种传输方式，可以自动选择最佳传输方式，并在不支持 WebSocket 的情况下自动降级到 HTTP 长轮询。
- 在服务器端使用
io.emit可以向所有连接的客户端发送消息；在客户端使用socket.emit可以向服务器发送消息，并使用socket.on监听服务器的消息。 - Socket.io 支持多种事件类型，在实现多人实时协作功能时，可以自定义事件类型。例如，在游戏中，可以定义
move事件，当用户移动时，向服务器发起move事件，并将移动的坐标等信息作为参数传递。 - 可以通过
socket.id获取连接的唯一标识符，并根据不同的连接处理不同的业务逻辑。
结语
通过以上代码，已经可以实现一个简单的多人实时协作功能了。当然，在实际开发中，还需要考虑更加复杂的场景，例如权限管理、数据校验、数据存储等。但是，通过本文的介绍，读者可以了解到如何使用 Socket.io 在 Express 中实现多人实时协作，并在此基础上进行更加复杂的开发。同时，本文也提供了一份完整的示例代码，读者可以参考并运行该代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6593c42ceb4cecbf2d86700e