镇海淘宝网站建设水资源监控能力建设 网站
Socket.IO 是一个基于 Node.js 的实时应用库，它封装了 WebSocket 协议，同时提供了降级方案，在不支持 WebSocket 的环境下能自动切换到其他传输方式，如 HTTP 长轮询。
核心概念
WebSocket ：HTML5 提供的一种在单个 TCP 连接上进行全双工通信的机制，实现客户端与服务器的实时通信。
实时通信 ：服务器和客户端能够在任意时刻相互发送数据。
降级机制 ：当 WebSocket 不可用时，Socket.IO 会自动降级到 HTTP 长轮询等其他通信方式。
安装
服务器端（Node.js）
npm install socket.io
客户端
<script src="/socket.io/socket.io.js"></script>
当你使用 socket.io 模块创建一个实例（比如 const io = require(‘socket.io’)(server)）时，Socket.IO 默认会在你的 HTTP 服务上挂载一个中间件，用来处理对 /socket.io/ 路径下的请求。
当浏览器访问 /socket.io/socket.io.js 时，实际上是连接到了你 Node.js 后端运行的 socket.io 库内部的一个内置 HTTP 接口，这个接口会动态返回客户端所需的 JavaScript 文件（即 socket.io.js 或压缩后的 socket.io.min.js）
基本使用
服务器端示例(与 Express 集成)
const express = require('express');
const app = express();
const http = require('http').Server(app);
const io = require('socket.io')(http);// 中间件
app.use(express.json());
app.use(express.static('public'));// API 路由
app.get('/api/users', (req, res) => {res.json([{ id: 1, name: 'John' }]);
});// Socket.IO 连接// 监听客户端连接事件
io.on('connection', (socket) => {console.log('一个用户已连接');// 监听客户端发送的消息socket.on('chat message', (msg) => {// 向所有连接的客户端广播消息io.emit('chat message', msg);});// 监听客户端断开连接事件socket.on('disconnect', () => {console.log('一个用户已断开连接');});
});const port = 3000;
http.listen(port, () => {console.log(`服务器运行在端口 ${port}`);
});客户端示例
<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><title>Socket.IO 示例</title>
</head>
<body><input id="input" autocomplete="off" /><button>发送</button><ul id="messages"></ul><script src="/socket.io/socket.io.js"></script><script>const socket = io();const input = document.getElementById('input');const button = document.querySelector('button');const messages = document.getElementById('messages');button.addEventListener('click', () => {if (input.value) {// 向服务器发送消息socket.emit('chat message', input.value);input.value = '';}});// 监听服务器发送的消息socket.on('chat message', (msg) => {const item = document.createElement('li');item.textContent = msg;messages.appendChild(item);});</script>
</body>
</html>