实时 AI 流式传输：构建响应式 AI 聊天机器人和应用程序

在 AI 的世界中，延迟是用户参与度的最大天敌。等待 5-10 秒才能获得完整的响应感觉太慢了。实时 AI 流式传输 (Real-time AI streaming) 允许您在单词生成时就展示出来，让您的应用程序感觉是即时的和交互式的。

AI 流式传输如何工作

大多数大语言模型 (LLM) 都是按词元 (token) 逐个生成的。ModelRiver 会在生成过程中捕获这些词元，并立即将它们推送到您的应用程序，而不是等待模型完成。

轮询 vs. 流式传输

轮询 (Polling)： 您的应用反复询问服务器 “准备好了吗？”。这增加了显著的开销和延迟。
流式传输 (Streaming)： 服务器在数据可用时将其推送到您的应用。这是 AI 界面的黄金标准。

使用 ModelRiver 实现流式传输

ModelRiver 提供了两种处理实时交付的主要方式：

1. 服务器发送事件 (SSE)

标准的 HTTP 流式传输。最适合在您自己的服务器上处理连接的简单集成。

2. WebSocket 交付（推荐）

ModelRiver 原生的 WebSocket 支持可实现最低的延迟。使用 @modelriver/client SDK，您可以直接连接到 ModelRiver 网关。

JAVASCRIPT

1import { useModelRiver } from '@modelriver/client';
2 
3const { connect, message } = useModelRiver();
4 
5// 连接到特定的 AI 请求流
6connect({ websocket_url, ws_token, channel_id });
7 
8// 'message' 会在实时自动更新

为感知性能进行优化

流式传输不仅仅是为了更快速的数据，它还关乎更好的 UX。

即时反馈： 在用户点击发送的那一刻，显示 “Thinking...” 状态。
平滑动画： 通过轻微的淡入或滑入效果渲染词元。
自动滚动： 确保聊天窗口在内容流出时保持在底部。

处理流式传输中的边缘情况

连接中断

@modelriver/client SDK 具有自动重连逻辑。如果用户一时失去了 Wi-Fi，流可以继续恢复而不会丢失上下文。

不完整的 JSON

当使用结构化输出时，流式传输部分 JSON 可能会很棘手。ModelRiver 处理这一问题的方式是通过缓冲或提供已验证的部分数据块，这样您的 UI 就不会崩溃。

为什么使用 ModelRiver 进行流式传输？

构建稳健的流式传输基础设施是很困难的。您必须管理 WebSocket 状态、处理跨区域连接，并处理各个供应商特定的流式传输格式。

ModelRiver 作为一个统一的抽象层：

一个协议适用于 OpenAI、Anthropic 和 Gemini。
内置的故障转移支持——即使在中途。
专门的 CLI 工具用于本地测试流。

实时 AI 流式传输