一、SSE 是什么
SSE（Server-Sent Events）是服务器向客户端持续推送数据的一种方式。它不要求客户端反复轮询，服务器有新内容就直接往下发。这个模型很适合AI 聊天的流式输出、实时通知、股票行情这类场景。
SSE 的几个特点比较直接：
- 单向通信，只有服务器推客户端
- 基于 HTTP，不需要额外的协议栈
- 断线后浏览器会自动重连
- 传输内容以文本为主，通常会包一层 JSON
- 实现成本低，适合做轻量实时更新
二、SSE 的工作方式
连接建立时，客户端先发起一个普通 HTTP 请求。服务端返回 Content-Type: text/event-stream，告诉浏览器后面的响应不是一次性结束，而是一条持续的事件流。
消息格式很简单：
data: 消息内容\n\n
这里的 data: 是固定前缀，后面跟实际内容，两个换行表示这一条消息结束。实际开发里，内容一般会放 JSON，方便前后端对齐字段。
客户端收到流之后，要自己把分块内容拼起来，再按消息边界拆开处理。浏览器里常见的两种做法是 EventSource 和 fetch + ReadableStream。
三、前端接 SSE 的两种写法
1. 原生 EventSource
EventSource 是浏览器自带的 SSE 客户端 API，接起来很省事：
const sse = new EventSource('/api/stream');
sse.addEventListener('message', (event) => {
const data = JSON.parse(event.data);
console.log('收到数据:', data);
});
sse.addEventListener('error', (event) => {
console.error('SSE错误:', event);
});
它的限制也很明确：只能发 GET 请求，不能直接带 POST body。只要你的场景能接受这一点，它就是最省心的方案。
2. fetch + ReadableStream
如果要把用户输入一起发给后端，比如把 prompt 传给 AI 模型，那 fetch 更合适。它本身不叫 SSE，但可以按 SSE 的格式去读流。
response = (, {
: ,
: {
: ,
},
: .({ : inputText }),
});
(!response.) ();
(!response.) ();
reader = response..();
decoder = ();
buffer = ;
() {
{ done, value } = reader.();
(done) ;
buffer += decoder.(value, { : });
lines = buffer.();
buffer = lines.() || ;
( line lines) {
(!line.()) ;
dataStr = line.();
data = .(dataStr);
}
}
