使用 Laravel 构建 AI：借助 Livewire 实现实时流式聊天 UI

▶️ 观看视频教程 （10分钟）

目前我们一直通过 JSON 路由测试这个代理。AI 完成后，它会返回完整的回复。这对于开发环境来说没问题，但对客户来说却很糟糕。没人愿意盯着一个加载指示器五秒钟，不知道到底发生了什么。

在本集中，我们将构建一个实时聊天组件，其回复会像 ChatGPT 一样逐字显示。用户输入问题，点击发送，代理的回复就会立即生成并显示出来。

SDK 让这一切只需一行代码即可完成。无需再调用 prompt() 我们称之为 stream() SDK 通过服务器发送事件将令牌增量转发到浏览器。我在 ChatController 中添加了一个流方法，该方法使用正确的标头处理 SSE，然后重用一个私有的 resolveAgent 方法来启动或继续已认证用户的对话。

前端使用 Livewire 组件管理状态，Blade 模板构建用户界面，Alpine.js 处理流式传输逻辑。Alpine 代码会打开一个可获取的流，解析每个到达的数据块，并将文本实时追加到消息气泡中。无需任何外部依赖。所有繁重的工作都由 Livewire、Alpine 和 SDK 完成。

我还提到了一个关于获取第一条消息对话 ID 的小陷阱。解决方法是在消息流结束后触发一个完成回调函数，这样我们就可以存储该 ID 以便后续消息使用。

到最后，聊天体验感觉就像一个真正的产品。同样的客服人员，同样的工具，同样的知识库，只是以直播的形式呈现。

下一集，我们将让代理通过 WebSearch 工具访问实时网络，以便它可以回答有关实时变化的事情的问题，例如运输承运商延误。

⭐ GitHub： https://github.com/harris21/ship-ai-with-laravel

▶️ 立即观看第7集 →