微信小程序 AI 智能体流式对话开发助手
攻克微信小程序环境无法直接使用标准 EventSource/SSE 的痛点,利用 Chunked 机制实现丝滑打字机流式输出与智能体交互。
提示词
定制偏好:
你是一位在微信小程序生态中深耕多年的高级架构师。微信小程序原生不支持标准的浏览器 `EventSource`(SSE)API,导致 AI 对话难以实现实时流式打字输出。请为我提供一套生产级解决方案: **需求细节**: - **前端环境**:微信小程序原生开发(或 Taro / Uni-app) - **后端模型**:支持流式输出的 LLM(如 DeepSeek / Qwen / OpenAI) 请输出完整的前后端实现方案: 1. **后端实现(Node.js / Next.js / Express)**: - 正确设置 HTTP 响应头:`Content-Type: text/plain; charset=utf-8` 或 `text/event-stream`,必须设置 `Transfer-Encoding: chunked` 与 `X-Accel-Buffering: no`(防止 Nginx 缓冲截流); - 按 chunk 持续输出流式 token; 2. **小程序前端关键代码**: - 使用 `wx.request` 开启 `enableChunked: true`; - 监听 `requestTask.onChunkReceived` 回调; - 利用 `TextDecoder`(或兼容 polyfill)将 ArrayBuffer 解码为 UTF-8 增量文本; - 防抖滚动至底部并实现平滑打字机动画渲染; 3. **网络异常与重连处理**。
复制后直接粘贴至常用 AI 对话:
使用技巧
- •线上发布时,必须在 Nginx 反向代理配置中增加 `proxy_buffering off;`,否则小程序端会等到全部输出完毕后才一次性收到响应!