feat(ai): 后台 AI 链路改走 HTTP 流式,WS 地址与心跳收敛到 utils

写作 / 图片 / 大纲 / 稿件四条链路用普通 POST 时,生成期间链路上零字节,
会被 60s 空闲超时掐成 504(出图实测 58s 断开)。后端已给每条链路开
/stream(SSE,每 15s 一帧心跳),这里改成消费它。

- 新增 utils/ai-stream.ts:SSE 帧解析 + 末帧 {type:'final', result} 拆包;
  runCreativeAssistantStream / runManuscriptGenStream 对外仍返回原来的 data,
  页面渲染逻辑不动
- 新增 utils/chat-socket.ts:buildWebSocketUrl 统一拼 /api/chat/{userId}
  (网关只放行 /api 前缀),attachHeartbeat 每 25s 发 ping 顶住代理空闲超时
- chatgpt 对话先试 WebSocket,握手失败落 /ai/chat/message/stream,
  帧内容与 WS 完全一致,处理函数直接复用
- 四个页面删掉各自重复的 buildWebSocketUrl,统一从 utils 引入
This commit is contained in:
2026-10-21 19:18:08 +08:00
parent 038e789cb0
commit 6f7f2f0d9a
7 changed files with 354 additions and 85 deletions
+23 -23
View File
@@ -229,13 +229,14 @@
import { asBlob } from 'html-docx-js-typescript';
import { getProcessor } from 'bytemd';
import { manuscriptGen } from '@/api/ai/manuscriptGen';
import { runManuscriptGenStream } from '@/utils/ai-stream';
import type {
ManuscriptGenParams,
ManuscriptGenResult
} from '@/api/ai/manuscriptGen/model';
import { uploadFile } from '@/api/system/file';
import type { FileRecord } from '@/api/system/file/model';
import { API_BASE_URL } from '@/config/setting';
import { attachHeartbeat, buildWebSocketUrl } from '@/utils/chat-socket';
import { useUserStore } from '@/store/modules/user';
import { copyText } from '@/utils/common';
import { resolveDisplayText, isFailedPayload, pickDisplayable, FAILED_TEXT } from '@/utils/ai-result';
@@ -560,17 +561,6 @@
return typeof payload === 'object';
};
const buildWebSocketUrl = (userId: number) => {
if (/^https?:\/\//.test(API_BASE_URL)) {
const url = new URL(API_BASE_URL);
url.protocol = url.protocol === 'https:' ? 'wss:' : 'ws:';
url.pathname = url.pathname.replace(/\/api\/?$/, '');
return `${url.toString().replace(/\/$/, '')}/chat/${userId}`;
}
const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
return `${protocol}//${window.location.host}/chat/${userId}`;
};
const clearStreamResolver = () => {
streamResolverRef.value = null;
};
@@ -696,6 +686,7 @@
}
};
socket.onopen = () => {
attachHeartbeat(socket);
wsConnected.value = false;
};
socket.onmessage = (event) => {
@@ -859,25 +850,34 @@
loading.value = true;
clearGenerated();
generatedTitle.value = form.theme.trim();
responseSummary.value = '正在建立 WebSocket 连接...';
responseSummary.value = '正在提交生成任务...';
try {
await connectWebSocket();
// 一律走 HTTP 流式(/stream),不再先连 WebSocket:
// 触发生成的那个 POST 在整段生成期间是零字节的,会被链路上的 60s 空闲
// 超时掐成 504 Gateway Time-out(自由创作、不选文体时最先撞上)。
// /stream 每 15s 有后端心跳续命,正文逐段喂给原来的帧处理,
// 结构化结果从末帧 {type:'final'} 取。
const payload = buildPayload();
responseSummary.value = templateMode.value
? '连接成功,已提交生成任务,等待流式返回...'
? '已提交生成任务,等待流式返回...'
: '自由创作已提交给 AI 创意助手,生成完成后一次性返回...';
const waitStream = createStreamWaiter();
const result = await manuscriptGen(buildPayload());
if (!streamStarted.value && shouldTreatAsDirectResult(result)) {
const result = await runManuscriptGenStream(
payload as unknown as Record<string, unknown>,
undefined,
(raw) => handleSocketMessage(raw)
);
if (result) {
applyParsedResult(
typeof result === 'string' ? parseSerializedResult(result) : (result as ManuscriptGenResult),
typeof result === 'string'
? parseSerializedResult(result)
: (result as ManuscriptGenResult),
'接口直接返回生成结果'
);
loading.value = false;
resolveStream();
disconnectWebSocket();
} else {
await waitStream;
}
// 兜底:流结束但没收到 __END__ 时也别把页面卡在加载中
resolveStream();
await waitStream;
message.success('内容生成完成');
} catch (e: any) {
disconnectWebSocket();