服务器发送事件(SSE)- 简单高效的实时通信方案
# 前言
在实时通信领域,我们已经了解了WebSocket和MQTT这两种强大的协议。🏗️ 但你是否想过,有一种更轻量级的解决方案,它基于我们熟悉的HTTP协议,却能实现高效的服务器到客户端的数据推送?这就是今天的主角——服务器发送事件(SSE)。让我带你探索这个被低估的实时通信技术!🚀
# SSE是什么?
THEOREM
**服务器发送事件(Server-Sent Events, SSE)**是一种允许服务器向客户端推送实时更新的技术标准。它基于HTTP协议,使用单向通信(服务器→客户端),特别适合需要服务器主动推送数据的场景。
SSE的核心特点:
- 基于HTTP(默认端口80/443)
- 使用持久HTTP连接
- 单向通信(仅服务器→客户端)
- 自动重连机制
- 文本消息格式(UTF-8)
- 轻量级实现
# 与WebSocket的对比
| 特性 | SSE | WebSocket |
|---|---|---|
| 协议 | HTTP | 自定义协议 |
| 双向通信 | ❌ 仅单向 | ✅ 双向 |
| 重连机制 | ✅ 内置 | ❌ 需手动实现 |
| 二进制支持 | ❌ 仅文本 | ✅ 支持二进制 |
| 复杂度 | 🟢 简单 | 🟡 中等 |
| 浏览器兼容性 | 🟢 广泛 | 🟡 需polyfill |
💡 个人建议:如果你的场景只需要服务器→客户端的单向推送,SSE是比WebSocket更简单、更轻量的选择!
# SSE工作原理
SSE的工作流程如下:
- 客户端通过
EventSourceAPI发起请求 - 服务器保持HTTP长连接
- 服务器以
text/event-stream格式发送数据 - 客户端自动处理消息和重连
典型的SSE消息格式:
event: message
data: 这是第一条消息
id: 123
data: 这是第二条消息
id: 124
1
2
3
4
5
6
2
3
4
5
6
# 实战:使用SSE实现实时通知
# 前端实现
// 创建EventSource连接
const eventSource = new EventSource('/api/notifications');
// 监听消息
eventSource.onmessage = (event) => {
const data = JSON.parse(event.data);
console.log('收到新通知:', data);
};
// 监听特定事件类型
eventSource.addEventListener('newOrder', (event) => {
console.log('新订单提醒:', event.data);
});
// 处理错误
eventSource.onerror = (err) => {
console.error('SSE错误:', err);
eventSource.close();
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 后端实现(Node.js示例)
const express = require('express');
const app = express();
app.get('/api/notifications', (req, res) => {
res.setHeader('Content-Type', 'text/event-stream');
res.setHeader('Cache-Control', 'no-cache');
res.setHeader('Connection', 'keep-alive');
// 模拟实时推送
setInterval(() => {
const data = {
type: 'notification',
message: `新消息 ${new Date().toLocaleTimeString()}`,
id: Date.now()
};
res.write(`data: ${JSON.stringify(data)}\n\n`);
}, 2000);
});
app.listen(3000, () => {
console.log('SSE服务器运行在 http://localhost:3000');
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
# SSE适用场景
SSE在以下场景表现出色:
- 实时仪表盘:股票行情、系统监控
- 通知系统:消息推送、邮件提醒
- 新闻更新:实时新闻流
- 社交媒体:动态更新
- 在线协作:文档协作状态
# 结语
SSE虽然不如WebSocket灵活,但它以极低的实现成本和出色的浏览器兼容性,在单向实时通信领域占据着不可替代的位置。🤔 当你只需要服务器向客户端推送数据时,不妨考虑SSE这个优雅的解决方案!
🌟 总结:选择通信协议时,不要只追逐最强大的技术,而应根据实际需求选择最适合的工具。SSE正是这种"恰到好处"的解决方案——简单、高效、可靠!
"简单是最终的复杂" —— 达芬奇
上次更新: 2026/01/28, 15:36:58