一、什么是SSE？
SSE（Server-Sent Events）是一种服务器向客户端推送数据的技术，它允许服务器主动向客户端发送数据，而不需要客户端频繁轮询。SSE特别适合实时通信场景，比如AI聊天的流式输出、实时通知、股票行情更新等。
SSE的核心特点：
- 单向通信 ：服务器向客户端单向推送数据
- 基于HTTP ：使用标准的HTTP协议，不需要特殊的服务器支持
- 自动重连 ：连接断开时会自动尝试重连
- 文本格式 ：使用简单的文本格式传输数据
- 轻量级 ：实现简单，开销小
二、SSE的工作原理
1. 连接建立
客户端通过向服务器发送一个HTTP请求来建立SSE连接。服务器返回一个特殊的响应，设置 Content-Type: text/event-stream 头，告诉客户端这是一个SSE流。
2. 数据传输
服务器以流的形式持续发送数据，每个数据块都是一个SSE格式的消息。SSE消息格式如下：
data: 消息内容\n\n
其中：
- data: 是固定前缀
- 消息内容可以是任意文本，通常使用JSON格式
- \n\n 是消息结束标志
3. 客户端处理
客户端接收并解析流式数据，根据消息内容进行相应处理。在浏览器中，可以使用 EventSource API 或 fetch + ReadableStream 来处理SSE。
三、前端实现SSE的两种方式
方式一：使用原生 EventSource API
EventSource 是浏览器内置的SSE客户端API，使用非常简单：
const sse =newEventSource('/api/ stream'); sse.addEventListener('message',(event)=>{const data =JSON.parse(event. data); console.log('收到数据:', data);}); sse.addEventListener('error',(event)=>{ console.error('SSE错误:', event);});
注意 ： EventSource 只支持GET请求，无法发送POST数据。
方式二：使用 fetch + ReadableStream（适用于需要POST数据的场景）
当需要向服务器发送POST数据时（比如发送用户输入到AI模型），可以使用 fetch + ReadableStream 来模拟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);
