Node.js socket.io(WebSocket)
Socket.IO 是基于 WebSocket 的双向实时通信框架,适用于聊天室、实时协作等场景。支持自动降级到 HTTP 长轮询。
bash
npm install socket.ioHTTP vs WebSocket
| HTTP | WebSocket | |
|---|---|---|
| 通信方式 | 请求 → 响应(单向) | 双向实时 |
| 连接 | 每次请求新建连接 | 一次握手,持久连接 |
| 场景 | REST API | 聊天 / 实时推送 / 协作 |
服务端代码
js
import http from 'http'
import { Server } from 'socket.io'
import express from 'express'
const app = express()
const server = http.createServer(app)
const io = new Server(server, { cors: true })
const groupList = {}
io.on('connection', (socket) => {
// 加入房间
socket.on('join', ({ name, room }) => {
socket.join(room)
if (!groupList[room]) groupList[room] = []
groupList[room].push({ name, room, id: socket.id })
socket.emit('message', { user: '管理员', text: `${name} 进入了房间` }) // 只发给自己
socket.emit('groupList', groupList)
socket.broadcast.emit('groupList', groupList) // 广播给其他人
})
// 发送消息
socket.on('message', ({ text, room, user }) => {
socket.broadcast.to(room).emit('message', { text, user }) // 广播给同房间
})
// 断开连接
socket.on('disconnect', () => {
// 从 groupList 中移除该用户...
})
})
server.listen(3000)客户端
html
<script type="module">
import { io } from "https://cdn.socket.io/4.7.4/socket.io.esm.min.js";
const socket = io('ws://localhost:3000');
socket.emit('join', { name: '小明', room: '1008' })
socket.emit('message', { text: '大家好', room: '1008', user: '小明' })
socket.on('message', (data) => console.log(data))
socket.on('groupList', (list) => console.log(list))
</script>核心方法
| 方法 | 说明 |
|---|---|
socket.emit(e, data) | 只发给当前客户端 |
socket.broadcast.emit(e, data) | 广播给所有其他客户端 |
socket.broadcast.to(room).emit(e, data) | 广播给同房间其他客户端 |
socket.join(room) | 加入房间 |
io.on('connection', cb) | 客户端连接事件 |
socket.on('disconnect', cb) | 客户端断开事件 |