Socket.io 是一个流行的 WebSockets 库，用于在服务端与客户端之间建立实时连接。它包括了一组在服务端和客户端都可用的 API，使得建立双向通信变得非常容易。在本文中，我们将探讨在 Express.js 中使用 Socket.io 的最佳实践，并提供示例代码。
安装与配置
首先，我们需要安装 Socket.io 和 Express.js。可以使用以下命令进行安装：
npm install socket.io express
接下来，我们需要配置 app.js 文件，以便正确地初始化 Socket.io：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ----- ------ - ---------------------------- ----- -- - ----------------------------- -- -- --------- ----- ------------------- -------- -- - -------------- ---- --- ------------- --- -- ----- ------------------- -- -- ------------------- ------- -- ---- --------
这里，我们实例化了一个 Express 应用，并创建了一个 HTTP 服务器。我们将这个服务器传递给 Socket.io，以便在应用程序内访问服务器。
构造完成后，我们将定义一个 io.on 的事件监听器，用于接受来自客户端的连接请求。每当有一个新用户连接到服务器时，事件监听器都将触发，输出一个简单的消息到控制台。
最后，我们在端口 3000 上启动服务器。现在，我们已经准备好了开始编写 Socket.io 服务端程序的最佳实践。
基本用法
让我们先来编写一个基本的应用程序，以便更好地了解 Socket.io 的一些基本用法。
服务端
以下代码将在服务器端定义一个名为 socket 的 Socket.io 实例。我们将使用 Socket.io 创建一个事件监听器，用于接受来自客户端的 message 事件。当客户端发送 message 事件时，服务端将向所有连接到服务器的客户端广播消息。
-- -------------------- ---- -------
----- -- - -----------------------------
------------------- -------- -- -
-------------- ---- --- -------------
-------------------- --------- -- -
--------------------- -------- -------------
-------------------- ---------
---
----------------------- -- -- -------------- ---- --- -----------------
---客户端
以下代码将在客户端中创建一个名为 socket 的 Socket.io 实例，该实例将尝试在服务器上建立连接。
-- -------------------- ---- ------- ----- ------ - ---------------------------- -------------------- -- -- - ---------------------- -- --- ---------- --- ---------------------- --------- -- - --------------------- -------- ------------- --- ----------------------- -- -- ------------------------- ---- --- -----------
这里，我们再次使用 io 创建一个连接到服务器的 socket 实例，我们为其添加了 connect、broadcast 和 disconnect 事件监听器。
当连接到服务器时，将在客户端的控制台输出 Connected to the server! 消息。当收到 broadcast 事件时，将输出来自服务端的消息。最后，当客户端与服务器的连接断开时，将输出 Disconnected from the server! 消息。
精细的控制
现在，我们已经掌握了 Socket.io 的基本用法，让我们更深入了解一些常见的场景，并考虑使用 Socket.io 的最佳实践。
指定客户端
有时你想要将消息只发送给一个特定客户端。例如，假设你有一个在线聊天应用，你希望用户向服务端发送一条消息，然后服务端将消息发送到聊天框中的所有用户，但这条消息不包括发件人自己。
要解决这个问题，我们可以使用 socket.id 属性，该属性包含 Socket.io 实例的唯一标识符。首先，我们将修改服务端代码，用 emit 方法替代 broadcast 方法，以便只向除了发件人以外的用户广播消息。
socket.on('message', (message) => {
console.log(`Received message: ${message}`);
socket.broadcast.emit('broadcast', message);
});然后，我们将为客户端创建一个 sendMessage 函数，该函数将在客户端上触发 message 事件。服务端将接受这个事件并使用 socket.broadcast.to(socketId) 方法，仅向特定客户端发送消息。
-- -------------------- ---- ------- ----- ----------- - --------- ------------ -- - ---------------------- -------- ------------- -- -------------------- --------- ------------ -- - --------------------- -------- ---------- --- --------- ----------------- -------------------------------------------------- -------- ----------- ---
状态管理
有时你需要知道你的客户端是否已经连接到服务器，以及它们目前的状态是否是 ready 或 not ready。你可以在客户端上设置一个布尔变量以跟踪它是否已准备就绪，并发出一个自定义的 ready 事件来通知服务端。
如果你的客户端在稍后时间重新连接到服务器，则需要实时更新其状态。在服务端，我们可以使用 io.to(socketId).emit 方法将当前服务器状态发送回客户端。
-- -------------------- ---- -------
--- ------- - ------
------------------- -------- -- -
-------------- ---- --- -------------
--------------------- - ------- ---
------------------ -- -- -
------- - -----
----------------- - -------- ---- ---
-------------- ---- -- --- ---------
---
----------------------- -- -- -
------- - ------
----------------- - -------- ----- ---
-------------- ---- --- ----------------
---
---在客户端上，我们将监听来自服务端的 status 事件。我们使用 Object.assign 方法将服务端发送的 isReady 属性合并到 socket 对象中。然后，我们可以使用这个 isReady 属性进行条件渲染或其他操作。
-- -------------------- ---- -------
--- ------ - -----
--- ------- - ------
----- ----------- - -- -- -
------ - ----------------------------
-------------------- -- -- -
---------------------- -- --- ----------
---------------------
---
------------------- -------- -- -
--------------------- --------
------- - ---------------
---------------------
---
--
----- ---------- - -- -- -
-- -------- -
--------------------
--------------------
------ - -----
-
--
----- ----------- - --------- -- -
-- --------- -
-------------------- -------- -------------
---------------------- ---------
-
--结论
在这篇文章中，我们探讨了在 Express.js 中使用 Socket.io 的最佳实践，并提供了一些示例代码。Socket.io 允许我们建立双向通信，这对于某些应用程序非常有用。
我们不仅介绍了 Socket.io 的基本用法，还讨论了一些更高级的用法，例如如何指定客户端、状态管理和事件管理。希望这些最佳实践能够帮助你更好地使用 Socket.io 并在你的应用程序中获得更好的用户体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672b14f5ddd3a70eb6d1976d