简单大模型对话框实现遇到的问题,叠在一起让现象变得比较迷惑,梳理一下:

1. 前端响应式绑定错误(核心bug)

assistantMsg最初是个普通对象(既不是ref也不是reactive),被push进数组后,后续content += delta的修改完全绕过了Vue的响应式追踪。表现为:流式数据其实正常在后台一块块到达,但界面全程不刷新,直到isStreaming.value = false触发整体重渲染,才"唰"一下把完整内容显示出来——也就是你说的"一整段蹦出来"。

修复:用reactive()包装assistantMsg。

2. 历史消息里的脏数据

因为问题1,每次流式失败,那个内容为空的assistant占位对象都会永久留在messages数组里,后续请求会把这些空消息一起发给模型,污染上下文。

修复:发送前用.filter()过滤掉空内容的消息。

3. 后端SSE响应头不完整

server/api/chat.post.ts里最初只设置了Content-Type,缺少X-Accel-Buffering: no和Cache-Control: no-transform,存在被中间层(Nginx/代理)缓冲导致流式失效的隐患。

修复:补全防缓冲的响应头。

4. API Key 与账户余额问题

依次遇到:

• 401 鉴权失败:key本身无效(可能是复制粘贴出错,或是key类型/平台不匹配)
• 402 余额不足:DeepSeek官方key本身有效,但账户没钱,而DeepSeek目前也没有长期免费额度

解决:换成阿里云百炼(免费额度大、支持DeepSeek/千问等多模型)的API Key和对应baseURL。