什么是j*ascript服务器推送_Server-Sent Events如何工作？

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

什么是j*ascript服务器推送_Server-Sent Events如何工作？

2025-12-13

浏览次数：次

返回列表

SSE 是服务器单向持续推送数据的轻量级 HTTP 机制。基于长连接，服务器保持响应打开并按 data: 格式写入，客户端用 EventSource 监听；需设置 text/event-stream 响应头、正确换行，支持自动重连与自定义事件。

什么是javascript服务器推送_server-sent events如何工作？

J*aScript 服务器推送（Server-Sent Events，SSE）是一种让服务器**单向、持续地向浏览器发送数据**的轻量级机制。它不是双向通信（不像 WebSocket），也不依赖轮询（不像传统 AJAX 轮询），而是基于 HTTP 的长连接，由服务器主动“推”数据给客户端。

Server-Sent Events 的核心原理

SSE 基于一个持久的 HTTP 连接：浏览器发起一次 GET 请求，服务器保持连接打开，并在有新数据时，按特定格式逐条写入响应流。浏览器内置的 EventSource API 自动解析这些数据，触发事件。

关键点：

协议是纯文本，每条消息以 data: 开头，可选带 id:（用于断线重连）、event:（自定义事件名）、retry:（重连间隔毫秒）
服务器必须设置响应头：Content-Type: text/event-stream 和 Cache-Control: no-cache
连接默认在断开后自动重试（约 3 秒），支持手动关闭
只支持服务器 → 浏览器方向，适合实时通知、日志流、股票行情等场景

前端怎么用 EventSource？

只需创建 EventSource 实例，监听事件即可：

注意：EventSource 只支持 GET，不携带 Cookie（除非显式配置 withCredentials: true），且跨域需服务器返回 Access-Control-Allow-Origin。

Musho

AI网页设计Figma插件

76 查看详情 Musho

后端如何发送 SSE 数据？（以 Node.js Express 为例）

关键是保持响应不结束、正确设置头部、按格式输出：

app.get('/api/notifications', (req, res) => {
res.writeHead(200, {
'Content-Type': 'text/event-stream',
'Cache-Control': 'no-cache',
'Connection': 'keep-alive'
});

// 发送一条消息
res.write('data: {"msg": "欢迎连接"}\n\n');

// 每 2 秒推送一次更新
const interval = setInterval(() => {
res.write(`data: {"time": "${new Date().toISOString()}"}` + '\n\n');
}, 2000);

req.on('close', () => {
clearInterval(interval);
res.end();
});
});