SSE 服务端推送事件演示 - 接收实时数据流

SSE 是 HTML5 规范中的一种服务器推送技术，允许服务器通过 HTTP 连接向客户端单向推送实时数据。它基于标准的 HTTP 协议，使用 text/event-stream MIME 类型，客户端通过 EventSource API 接收数据。SSE 自动处理重连、事件ID追踪，比轮询更高效，比 WebSocket 更轻量。

SSE：单向通信（服务器→客户端），基于HTTP，自动重连，支持事件ID，更简单轻量，适合实时通知、数据流推送。
WebSocket：双向通信，独立协议（ws://），需要握手升级，适合聊天、游戏等需要客户端频繁发送数据的场景。
选择建议：只需服务器推送数据时选SSE；需要双向实时交互时选WebSocket。

const es = new EventSource('/events');
es.onmessage = (e) => console.log(e.data);
es.addEventListener('custom', (e) => { ... });
es.onerror = (e) => { /* 处理错误 */ };
es.close(); // 关闭连接

每条消息由多个字段组成，字段之间用换行分隔，消息之间用空行分隔：
event: 事件类型\n（可选，默认message）
id: 消息ID\n（可选，用于断线重连）
data: 数据内容\n（支持多行）
retry: 重连间隔毫秒\n（可选）
每条消息以 \n\n 结束。

所有现代浏览器都原生支持 SSE 和 EventSource API：Chrome 6+、Firefox 6+、Safari 5+、Edge 79+、Opera 11+。IE 不支持（已淘汰）。移动端 iOS Safari 4+、Android Browser 4.4+ 也完全支持。

EventSource 内置自动重连机制。当连接断开时，浏览器会自动尝试重连。服务器可通过 id 字段标记消息，客户端重连时会自动发送 Last-Event-ID 请求头，服务器可据此从断点继续推送。通过 retry 字段可自定义重连间隔。

支持。服务器在推送时设置 event: 自定义类型名，客户端使用 addEventListener('自定义类型名', callback) 来监听。默认不设置event字段时，触发 onmessage 回调。这允许在同一条SSE连接上区分不同业务类型的数据。

优点：基于HTTP，穿透防火墙/代理友好；自动重连；轻量级；支持事件ID；原生浏览器支持。
缺点：仅单向推送；HTTP/1.1下每域名最多6个并发连接；不支持二进制数据（仅文本）；无法像WebSocket那样高效双向通信。

Node.js (Express)：设置 Content-Type: text/event-stream 和 Cache-Control: no-cache，保持响应连接，使用 res.write() 推送数据。
Python (Flask)：使用生成器函数配合 Response 的 mimetype='text/event-stream'。
Java (Spring)：使用 SseEmitter 或 Spring WebFlux。

✅ 实时通知推送（消息提醒、系统公告）
✅ 实时数据仪表盘（监控大屏、统计数据）
✅ 股票/加密货币行情更新
✅ 实时日志流查看
✅ AI对话流式输出（ChatGPT风格）
✅ 社交媒体动态更新
✅ IoT设备状态推送