Socket.io 用于 JavaScript (Node.js)：完整指南及示例

什么是 Socket.io，为什么需要它？

Socket.io 是一个强大的 JavaScript 库，它提供了客户端（浏览器）和服务器（Node.js）之间的 实时双向通信。与传统的 HTTP 协议（客户端发送请求并等待响应）不同，Socket.io 允许服务器随时主动向客户端发送数据，反之亦然。

为什么需要它？ 想象一下聊天应用、在线游戏、带有实时图表的仪表板或协作编辑文档系统。在这些场景中，数据必须即时更新，而无需刷新页面。HTTP 不适合这种情况，因为它基于“请求-响应”模式。Socket.io 通过建立持久连接（通常通过 WebSocket）解决了这个问题，数据可以随时在双方之间双向传输。

Socket.io 的主要特点：

• 双向性： 服务器和客户端可以相互发送消息。
• 实时性： 消息即时传递（延迟极低）。
• 自动重连： 如果连接断开，Socket.io 会自动尝试恢复连接。
• 房间（Rooms）： 可以将客户端分组，仅向特定组发送消息。
• 命名空间（Namespaces）： 将应用程序划分为独立的通信通道。
• 可靠性： 如果 WebSocket 不受支持，Socket.io 会自动切换到其他方法（如 long-polling、FlashSocket 等）。

安装 Socket.io

Socket.io 由两部分组成：服务器端（用于 Node.js）和客户端（用于浏览器）。两者都可以通过 npm 安装。

安装服务器端

在项目文件夹中打开终端并执行以下命令：

npm install socket.io

安装客户端

客户端脚本可以通过两种方式引入：

1. 通过 CDN（初学者最简单的方式）：

<script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>

2. 通过 npm（适用于使用打包工具如 Webpack 的项目）：

npm install socket.io-client

快速入门：第一个聊天应用

让我们创建一个最简单的聊天应用，其中一个客户端发送的消息可以被所有其他客户端看到。

步骤 1：服务器（server.js 文件）

// server.jsconst http = require('http');const { Server } = require("socket.io");

// 1. 创建 HTTP 服务器const server = http.createServer((req, res) => {    res.writeHead(200, { 'Content-Type': 'text/plain' });    res.end('Socket.io 服务器已启动');});

// 2. 创建绑定到服务器的 Socket.io 实例const io = new Server(server);

// 3. 处理新客户端连接io.on('connection', (socket) => {    console.log('新用户已连接:', socket.id);

    // 4. 监听来自客户端的 'chat message' 事件    socket.on('chat message', (msg) => {        console.log('消息:', msg);        // 5. 向所有连接的客户端发送消息（包括发送者）        io.emit('chat message', msg);    });

    // 6. 处理客户端断开连接    socket.on('disconnect', () => {        console.log('用户已断开连接:', socket.id);    });});

// 7. 在端口 3000 上启动服务器server.listen(3000, () => {    console.log('服务器已启动，地址为 http://localhost:3000');});

步骤 2：客户端（index.html 文件）

<!DOCTYPE html><html><head>    <title>Socket.io 聊天</title>    <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>