Browse Source

fix(sdk): 流式零内容时降级路径未渲染答案,界面永久停在「正在思考...」

问题:第三方页面反馈「对话框一直显示正在思考...,但控制台里请求与响应数据都正常」。

定位:服务端这次的流式响应只回了「开场 role 帧 + finish_reason=stop 帧 + [DONE]」三个控制帧、
零内容(服务端成因见后一个提交)。SDK 的 sendStreamMessage 在 onDone 里发现零内容时确实会
降级再发一次同步 /ai/chat,但该分支只写 `chatRequest(...).then(resolve)` —— 既不渲染气泡也不
收掉 loading;而 produceAIReply 的 streaming 分支把「渲染气泡 + 收 loading」全权委托给了
onChunk 回调,这条路径拿不到 onChunk。结果同步拿到的答案被静默丢弃、loading 永不消失。

- 降级路径补齐 hideLoading + renderAIBubble(复用 dom.ts 已有实现,终态与非流式分支一致)
- 同一函数另一处同类出口:首个 token 之前点「停止生成」时 loading 同样不会被收,且会把一条
  空 AI 消息写进历史。补 hideLoading;并在 produceAIReply 加守卫:aiContent 为空串时不 push、
  不落库、不派发 csk:newMessage(避免历史里多出空气泡)
- 流式零内容时上报 onError code=stream_empty,不再静默;README 补该错误码与触发方式说明

验证:用逐字复刻线上那 3 帧的 mock 流驱动真实 SDK(puppeteer)——降级拿到的答案被正常渲染成
气泡、「正在思考...」消失、onError 收到 stream_empty,请求序列与线上 HAR 一致;正常带内容的流
不受影响(errors 为空、syncFallbackCalls=0);首 token 前中止时 loading 消失且历史无空消息。
client 单测 92 个全绿。

(static/sdk/test.html 仅两条 link 顺序变化,hash 未变,属构建产物顺序抖动)
dev
wanghanlin 2 weeks ago
parent
commit
20d9a889ac
  1. 3
      client/README.md
  2. 32
      client/src/chat.ts
  3. 2
      src/main/resources/static/sdk/test.html

3
client/README.md

@ -202,7 +202,7 @@ SDK 产物位于 `client/dist/` 目录:
默认开启(`streaming: true`),AI 回复逐字输出,支持:
- 流式追加到气泡,实时滚动到底部
- 流中断兜底:保留已接收内容 + 灰色提示
- 无流内容时自动降级为同步请求
- 无流内容时自动降级为同步请求,并**把拿到的答案正常渲染出来**(同时上报 `onError` 的 `stream_empty`);用户点「停止生成」时不会再多发一次请求
### 4.2 Markdown 渲染
@ -449,6 +449,7 @@ ChatbotSDK.init({
| `auth_expired` | 刷新后仍返回 401,Token 彻底失效 | 检查 API Key 是否被吊销/过期、是否绑定了启用中的客服角色;修好后调 `setToken()` |
| `auth_refresh_failed` | 换 Token 的 `getToken` 回调失败(宿主后端异常或网络问题) | 检查宿主换 Token 接口;同一 code 30 秒内只上报一次,不会刷屏 |
| `config_invalid` | `init()` 传入的 `token` / `expiresIn` 等参数非法,该参数被忽略 | 按提示修正配置 |
| `stream_empty` | 服务端 SSE 流返回了**零内容**(只收到开场帧与收尾帧),SDK 已自动降级为同步请求并渲染答案 | 答案仍会出来(会慢一次往返)。若频繁出现,查后端:该模型是否流式输出为空(典型是 provider 的流式分片文本未被正确提取)。见 `SDK-INTEGRATION.md` |
---

32
client/src/chat.ts

@ -541,6 +541,15 @@ async function produceAIReply(userText: string, images?: ImageAttachment[]): Pro
renderAIBubble(messagesContainer, aiContent, aiTimestamp, aiMsgId);
}
}
// 零内容(服务端返回空串、或用户在首个 token 前点了「停止生成」):
// 不落库、不派发新消息事件,避免历史里多出一条空气泡(刷新后会渲染成空白)。
// 只需确保 loading 收掉;返回 false 让调用方恢复待发送图片便于重试。
if (!aiContent) {
if (hideLoadingFn) hideLoadingFn();
return false;
}
const aiMsg: ChatMessage = { id: aiMsgId, role: 'ai', content: aiContent, timestamp: aiTimestamp };
messages.push(aiMsg);
@ -619,14 +628,33 @@ async function sendStreamMessage(text: string, aiTimestamp: number, shouldUseRag
// 否则下面的「无流内容降级」分支会因 streamStarted=false 再发一次同步 /ai/chat 请求 ——
// 用户明明点了停止,却反而多发出一个请求。
if (signal.aborted) {
if (wrapperEl && bubbleEl) finalizeAIBubble(wrapperEl, bubbleEl);
if (wrapperEl && bubbleEl) {
finalizeAIBubble(wrapperEl, bubbleEl);
} else if (hideLoadingFn) {
// 首个 token 之前就被中止:气泡尚未创建,必须自己收掉 loading,
// 否则「正在思考...」会一直留在界面上
hideLoadingFn();
}
resolve(accumulated);
return;
}
// 无流内容降级为同步请求(须在 wrapperEl/bubbleEl 判断之外:
// 二者仅在 onChunk 收到首个 token 时才赋值,否则此分支不可达)
if (!streamStarted && accumulated === '') {
chatRequest(text, imageUrls).then(resolve).catch(reject);
// 服务端流式返回了零内容(典型:模型流式输出为空,只发了开场帧 + 收尾帧 + [DONE])。
// 上报专属错误码便于宿主/监控感知,不再静默。
logger.error('流式响应未返回任何内容,已降级为同步请求', undefined, 'stream_empty');
chatRequest(text, imageUrls)
.then((syncText) => {
// 降级路径必须自己完成「渲染气泡 + 收掉 loading」:
// produceAIReply 的 streaming 分支把这两件事全权委托给了 onChunk 回调
//(hideLoading 与 createEmptyAIBubble 都写在 onChunk 里),而本路径拿不到 onChunk。
// 漏了这一步,流式零内容时同步拿到的答案会被静默丢弃、界面永久停在「正在思考...」。
if (hideLoadingFn) hideLoadingFn();
if (messagesContainer) renderAIBubble(messagesContainer, syncText, aiTimestamp, aiMsgId);
resolve(syncText);
})
.catch(reject);
return;
}
if (wrapperEl && bubbleEl) {

2
src/main/resources/static/sdk/test.html

@ -11,8 +11,8 @@
<link rel="modulepreload" crossorigin href="/assets/markdown-BzlZwYco.js">
<link rel="modulepreload" crossorigin href="/assets/chatAdapter-BMDefjTd.js">
<link rel="stylesheet" crossorigin href="/assets/tdesign-CY0HVqZ3.css">
<link rel="stylesheet" crossorigin href="/assets/tdesign-chat-Dj1Q23QO.css">
<link rel="stylesheet" crossorigin href="/assets/tdesign-web-components-B-ycfzW_.css">
<link rel="stylesheet" crossorigin href="/assets/tdesign-chat-Dj1Q23QO.css">
<link rel="stylesheet" crossorigin href="/assets/sdk-test-C9_UiJCh.css">
</head>
<body>

Loading…
Cancel
Save