无需登录 数据私有 本地保存

Server-Sent Events 模拟器 - 单向实时数据流演示

开发工具 网络 EventSource SSE 实时 演示
1
0
0
0

SSE 模拟器

未连接
事件: 0 运行: 00:00 速率: 0/min
200ms 1500ms 5s
设为0禁用自动重连提示
EventSource API 示例
// 创建SSE连接 const evtSource = new EventSource('/api/events'); // 监听默认message事件 evtSource.addEventListener('message', (e) => { const data = JSON.parse(e.data); console.log(data); }); // 监听自定义事件 evtSource.addEventListener('stock_update', (e) => { console.log(e.lastEventId, e.data); }); // 错误处理与重连 evtSource.addEventListener('error', (e) => { if (evtSource.readyState === EventSource.CLOSED) { console.log('连接已关闭'); } }); // 关闭连接 evtSource.close();
等待事件推送...
点击"连接/启动"开始接收事件
: 等待SSE数据流...
0
总事件数
0
message事件
0
自定义事件
0
重连次数
事件类型分布
SSE (Server-Sent Events) 常见问题
什么是 Server-Sent Events (SSE)？

SSE 是一种服务器向客户端推送实时数据的技术，基于 HTTP 协议。与 WebSocket 不同，SSE 是单向的（仅服务器→客户端），但实现更简单，自动支持重连，原生被浏览器 EventSource API 支持。适用于股票行情、新闻推送、监控面板等场景。

SSE 和 WebSocket 有什么区别？

SSE 是单向的（服务器到客户端），基于 HTTP，实现简单，自动重连；WebSocket 是双向的，需要升级协议，适合聊天、游戏等双向交互场景。如果只需服务器推送数据，SSE 更轻量且无需额外库。

SSE 的自动重连机制如何工作？

当 SSE 连接断开时，浏览器会自动尝试重连。服务器可通过 retry 字段指定重连间隔（毫秒）。客户端重连时会自动发送 Last-Event-ID 头，服务器可据此推送断线期间遗漏的事件。

EventSource 支持哪些浏览器？

所有现代浏览器均原生支持 EventSource API：Chrome 6+、Firefox 6+、Safari 5+、Edge 79+、Opera 11+。IE 不支持，但可使用 polyfill 实现兼容。

SSE 数据格式是怎样的？

SSE 使用 text/event-stream MIME 类型。每条事件由多个字段行组成，以空行分隔。支持字段：event（事件类型）、data（数据，可多行）、id（事件ID）、retry（重连间隔）。以 : 开头的行为注释。

如何在后端实现 SSE？

后端需设置响应头 Content-Type: text/event-stream、Cache-Control: no-cache、Connection: keep-alive，然后持续写入格式化的数据。Node.js、Python Flask、Go、Java Spring 等均支持 SSE。

SSE 连接数有限制吗？

浏览器对同一域名的 HTTP 连接数有限制（通常 6 个），SSE 占用一个长连接。HTTP/2 下连接数限制大幅放宽。服务器端需考虑并发连接数，建议使用事件驱动架构（如 Nginx + 异步后端）。

SSE 适合什么场景？

适合实时单向数据推送：股票行情、新闻feed、监控仪表盘、日志流、通知推送、进度更新、IoT 传感器数据等。不适合需要客户端频繁发送数据的场景（应使用 WebSocket）。

🔧 相关工具