Socket.io 是一个支持实时双向通信的 JavaScript 库，它可以让我们在前端和后端之间建立 Websocket 连接，实现实时消息通信。在实际开发中，我们需要处理多种消息类型，例如普通文本消息、二进制消息、心跳消息等。本文将详细介绍 Socket.io 如何处理这些消息类型，并提供示例代码。
普通文本消息
在 Socket.io 中，发送普通文本消息很简单。我们可以使用 socket.emit() 方法向服务器发送文本消息，也可以使用 socket.on() 方法监听服务器发送的文本消息。
发送文本消息
// 前端代码
socket.emit('message', 'Hello, Socket.io!');
// 后端代码
socket.on('message', (msg) => {
console.log(`Received message: ${msg}`);
});上述代码中，我们使用 socket.emit() 方法向服务器发送一个名为 'message' 的文本消息，内容为 'Hello, Socket.io!'。在后端，我们使用 socket.on() 方法监听名为 'message' 的消息，并输出收到的消息内容。
广播文本消息
有时候，我们需要将文本消息发送给所有连接到服务器的客户端，这种操作叫做广播。在 Socket.io 中，我们可以使用 io.emit() 方法实现广播消息。
// 后端代码
io.emit('message', 'Hello, everyone!');在上述代码中，我们使用 io.emit() 方法向所有客户端广播名为 'message' 的消息，内容为 'Hello, everyone!'。
二进制消息
除了文本消息外，Socket.io 还支持二进制消息。在前端，我们可以使用 Blob 或 ArrayBuffer 类型来发送二进制消息，而在后端，我们需要使用第三方库 socket.io-file 来支持二进制消息的接收和发送。
发送二进制消息
-- -------------------- ---- ------- -- ---- ----- ---- - --- ------------- ------------- - ----- ------------ --- ------------------- ------ -- ---- ----- -- - ---------------------------- ----- ------ - ------------------ ----------------------- -------- ---------------------------
在上述代码中，我们使用 Blob 实例来创建一个包含 'Hello, Socket.io!' 文本的二进制数据块。在前端，我们使用 socket.emit() 方法将二进制数据发送到服务器，其中消息名为 'file'。在后端，我们使用 socket.io-stream 库来支持二进制消息的接收和发送，并使用 ss.createStream() 方法创建一个可写流，将接收到的二进制消息写到这个流中。
接收二进制消息
-- -------------------- ---- ------- -- ---- ----------------- ------ -- - ----- ---- - --- ------------ - ----- ----------- --- ----- --- - -------------------------- ----- --- - --- -------- ------- - ---- ------------------------------- --- -- ---- ----- -- - -------------- --------------------- -------- ----- -- - ----- -------- - --------------------- -------------------------------------------- ---
在上述代码中，我们使用 socket.on() 方法监听服务器发送的二进制消息，其中消息名为 'file'。在前端，我们将接收到的数据转换成 Blob 实例，并将其转换成 URL，创建一个图片元素，并将其添加到 body 中。在后端，我们使用 ss 来监听消息名为 'file' 的消息，并创建一个可写流将接收到的二进制消息写入到本地文件中。
心跳消息
Socket.io 还支持心跳机制，用于保持客户端和服务器之间的连接状态。在默认情况下，Socket.io 会每 25 秒发送一个心跳包，如果客户端在 60 秒内没有收到心跳包，就会认为与服务器的连接已断开。
发送心跳消息
在前端代码中，我们可以通过 socket.emit() 方法发送一个 'ping' 消息向服务器请求心跳消息。在后端，我们通过监听 'ping' 消息，并使用 socket.emit() 方法向客户端发送 'pong' 消息来响应心跳请求。
-- -------------------- ---- ------- -- ---- -------------- -- - -------------------- -- ------- -- ---- ----------------- -- -- - -------------------- ---
在上述代码中，我们使用 setInterval() 方法每 10 秒发送一个 'ping' 消息向服务器请求心跳消息。在后端，我们通过监听 'ping' 消息，并使用 socket.emit() 方法发送 'pong' 消息以响应心跳请求。
总结
本文介绍了 Socket.io 如何处理多种消息类型，包括普通文本消息、二进制消息和心跳消息。我们可以使用 socket.emit() 方法向服务器发送消息，也可以使用 socket.on() 方法监听服务器发送的消息。使用 io.emit() 方法可以向所有连接到服务器的客户端广播消息。为支持二进制消息，我们需要使用第三方库 socket.io-stream。心跳机制可以保持客户端和服务器的连接状态。在实际开发中，我们可以根据需求选择适当的消息类型，以实现实时通信功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647c4b24968c7c53b076489e