Server-Sent Events 实时流：EventSource 与断线重连实践

背景与价值SSE 适合单向实时通知与日志流；浏览器原生支持，网络穿透与代理兼容较好。客户端function connectSSE(url: string) {

let backoff = 1000, max = 30000;

let es = new EventSource(url);

es.onmessage = (e) => handle(JSON.parse(e.data));

es.onerror = () => {

es.close();

setTimeout(() => { backoff = Math.min(backoff * 2, max); es = connectSSE(url) as any; }, backoff);

};

return es;

}

服务端（Node/Express）app.get('/sse', (req, res) => {

res.set({ 'Content-Type': 'text/event-stream', 'Cache-Control': 'no-cache', Connection: 'keep-alive' });

res.flushHeaders();

const t = setInterval(() => res.write(`data: ${JSON.stringify({ ts: Date.now() })}\n\n`), 1000);

req.on('close', () => clearInterval(t));

});

指标验证（Chrome 128/Edge 130）首条消息延迟（P95）：≤ 400ms。断线恢复成功率：≥ 98%。稳定性：长时间连接无泄漏与异常；心跳正确。回退策略不支持或代理限制：回退为长轮询或 WebSocket。测试清单弱网与代理环境：连接稳定并恢复；消息顺序正确。