为什么大模型网站使用 SSE 而不是 WebSocket？

在大模型网站（如 ChatGPT、Claude、Gemini 等）中，前端通常使用 EventSource（Server-Sent Events, SSE） 来与后端对接，而不是 WebSocket。这是因为 SSE 更适合类似流式文本生成的场景。下面我们详细对比 SSE、WebSocket 和其他可选方案。

---

1. SSE（Server-Sent Events，服务器发送事件）

特点：

• 单向通信（服务器 → 客户端），适用于大模型输出流式文本的场景。
• 基于 HTTP/1.1 及 EventSource API，兼容性较好，易于集成。
• 自动重连，如果连接断开，浏览器会自动尝试重新连接。
• 轻量级，开销小，适合传输文本数据。

缺点：

• 只支持 服务器推送，客户端无法主动发送消息（需要用 AJAX/Fetch 结合）。
• 受 同源策略 影响，跨域时需要 CORS 配置。
• 在 HTTP/2 之前，SSE 只能打开 6 个连接（浏览器限制），但在 HTTP/2 上可复用单连接，问题减小。

适用场景：

✔ 流式返回（如 ChatGPT 逐字输出）
✔ 服务器向前端持续推送数据（如股票行情、日志监控）

---

2. WebSocket

特点：

• 全双工通信，客户端和服务器可以随时相互发送数据。
• 基于 TCP，独立于 HTTP，但通常通过 HTTP/HTTPS 协商（ws:// 或 wss://）。
• 低延迟，适用于高频交互（如实时聊天、游戏、协作编辑）。

缺点：

• 连接管理复杂（心跳检测、断线重连、负载均衡较难）。
• 代理/防火墙兼容性问题，某些企业网络可能会阻止 WebSocket。
• 服务器资源占用更大，需要维护长连接，占用线程/内存。

适用场景：

✔ 双向实时交互（如在线协作、弹幕、游戏匹配）
✔ 低延迟高频数据更新（如金融交易、物联网）

为什么大模型网站不用 WebSocket？

• WebSocket 适用于双向通信，而 大模型的输出是“流式”文本，客户端只需接收数据，WebSocket 的优势无法体现。
• WebSocket 需要额外的 连接管理，而 SSE 依赖于现有的 HTTP 连接，更易集成。

---

3. HTTP 长轮询（Long Polling）

特点：

• 客户端发送请求，服务器 保持连接不返回数据，直到有新数据才返回。
• 客户端收到数据后立即发送新的请求，模拟流式通信。
• 兼容性极好，所有 HTTP 服务器都支持。

缺点：

• 请求开销大，每次返回数据后都需要重新建立 HTTP 连接，浪费资源。
• 延迟较高，如果服务器没有数据，客户端必须定期请求，效率低。

---

4. gRPC（基于 HTTP/2 的流式通信）

特点：

• 双向流式通信（客户端和服务器都可以持续发送数据）。
• 基于 HTTP/2，性能较好，可在单个连接上多路复用请求。
• 适用于微服务通信，比 REST API 更高效。

缺点：

• 浏览器原生不支持，需要使用 gRPC-Web 代理转换。
• 复杂度高，部署比 SSE/WebSocket 难。

---

总结：哪种方式适合大模型前端？

方案	是否适用于大模型流式返回？	特点	适用场景
SSE（EventSource）	✅ 最佳选择	服务器 → 客户端单向推送，轻量、自动重连	流式输出（ChatGPT）、实时通知
WebSocket	❌ 过度设计	双向通信，低延迟，复杂连接管理	聊天、游戏、协作编辑
长轮询（Long Polling）	❌ 开销大	兼容性强但效率低，每次数据返回后需重新请求	旧系统支持
gRPC（HTTP/2 流）	❌ 需要代理	双向流式，高性能，浏览器需 gRPC-Web	微服务、API 交互

📌 所以，SSE 是最佳选择：

1. 天然支持流式输出，非常适合 ChatGPT 这类逐字返回的内容。
2. 轻量级、简单易用，只需 EventSource API，不需要额外的连接管理。
3. 支持 HTTP/2，比 WebSocket 适合这类请求响应模式。

---

实际应用示例（基于 SSE 实现大模型流式输出）

前端代码（使用 SSE 监听服务器消息）：

const eventSource = new EventSource('/chat/stream');  // 后端返回流式数据

eventSource.onmessage = (event) => {
  console.log('收到新消息:', event.data);
};

eventSource.onerror = () => {
  console.log('连接断开，尝试重连...');
  eventSource.close();
};

后端代码（Node.js 示例）：

app.get('/chat/stream', (req, res) => {
  res.setHeader('Content-Type', 'text/event-stream');
  res.setHeader('Cache-Control', 'no-cache');
  res.setHeader('Connection', 'keep-alive');

  let count = 0;
  const interval = setInterval(() => {
    res.write(`data: 你好，消息 ${count++}\n\n`);
    if (count > 5) {
      clearInterval(interval);
      res.end();
    }
  }, 1000);
});

---

结论

SSE 是 最适合大模型流式返回的方案，因为它：
✅ 轻量级
✅ 自动重连
✅ 支持 HTTP/2
✅ 适用于服务器单向推送

所以，大模型网站普遍使用 SSE，而不是 WebSocket！ 🚀

网站截图

DeepSeek

ChatGPT

Claude

文心一言

→ 以上 🐒