状态:设计收敛,待实现 日期:2026-04-24 相关系统:
- PPT (
/Users/buoy/Development/gitrepo/PPT) — 前端,对话页面DialogueChatView.vue- cococlass-english-speaking-api (
/Users/buoy/Development/gitrepo/cococlass-english-speaking-api) — 后端,/api/speaking/dialogue/...
当前 POST /api/speaking/dialogue/session 同时做两件事(app/service/speaking/dialogue_service.py:44-97):
DialogueSession DB 记录DialogueMessage前端 DialogueChatView.vue:950-956 在 onMounted 里调 engine.initSession(...),失败只 console.error(useDialogueEngine.ts:39-41),产生三个用户体验问题:
/speakPOST /speak 的语义是"学生音频 → ASR → LLM 回复",必带 audio 字段,开场白没有学生音频可喂。硬塞会污染 /speak 的单一职责。新加 POST /session/{id}/greeting 独立端点。
| 维度 | bundled (现状) | split |
|---|---|---|
| LLM 失败时 DB 状态 | rollback,无孤儿 | 无孤儿(session 早已 commit) |
| LLM 成功但响应丢包 | 真孤儿(session + msg 已 commit,前端无 sessionId) | 同样孤儿 但 有机会触发幂等 retry 自愈 |
| 重试一次开场白的成本 | 1 DB INSERT + 1 LLM 全量调用 | 1 LLM 全量调用 |
| sessionId 生命周期 | 每次重试都变 | 稳定,整个练习期一个 |
| 语义 | "重开一场" | "重新生成开场白" |
| 可靠性耦合 | session 建立被 LLM 失败率拖累 (~1% vs ~0.01%) | 解耦 |
POST /session/{id}/greeting 必须幂等:若该 session round=1 已存在 role='ai' 消息,直接返回已有内容,不重复落库、不重复调 LLM。这让前端重试 100% 安全。
POST /api/speaking/dialogue/session (改)Before: 创建 session + LLM 开场白 + 落 AI 消息 + commit
After: 只建 session,立即 commit 返回
Request: { topic, totalRounds, durationSeconds?, roleId?, userId? } // 不变
Response: {
sessionId: string,
totalRounds: number,
currentRound: 1,
expiresAt: string | null
// 删除 aiMessage 字段
}
失败场景:DB 错误(极低概率) → 500。
POST /api/speaking/dialogue/session/{session_id}/greeting (新)Request: (no body)
Response: { aiMessage: string }
200 正常生成 或 已存在(幂等命中)
404 session 不存在
409 session.status != 'active'
500 LLM 失败
行为:
round=1 && role='ai' 消息,若存在 → 直接返回其 contentcreate_session 步骤 2-3 调 LLM + 落 DialogueMessage + commit幂等性实现重点: 查询必须在同一事务内先查后写,避免并发双开场白(虽然单个用户并发调此接口的概率极低,仍加一层兜底)。
POST /speak、WS /speak-stream、GET /report 不变。
useDialogueEngine.ts拆分 initSession 为两个方法:
// 仅设置 session refs + 启动倒计时。不产生网络请求。
function attachSession(info: { sessionId: string; expiresAt?: string | null }) {
sessionId.value = info.sessionId
expiresAt.value = info.expiresAt ?? null
if (info.expiresAt) startCountdown(info.expiresAt)
}
// push loading AI 占位消息 → 请求 /greeting → 填内容或打 error
async function generateGreeting() {
if (!sessionId.value) return
const aiMsg = reactive<PreviewChatMessage>({
id: crypto.randomUUID(),
role: 'ai',
content: '',
timestamp: new Date(),
status: 'loading',
})
messages.value.push(aiMsg)
try {
const { aiMessage } = await api.generateGreeting(sessionId.value)
aiMsg.content = aiMessage
aiMsg.status = 'done'
speakTTS(aiMessage)
} catch (err: any) {
aiMsg.status = 'error'
aiMsg.error = friendlyErrorMessage(err?.message)
}
}
// 重试开场白:找到失败的首条 AI 消息,移除后重跑 generateGreeting
async function retryGreeting() {
const firstAi = messages.value.find(m => m.role === 'ai')
if (firstAi?.status !== 'error') return
messages.value = messages.value.filter(m => m.id !== firstAi.id)
await generateGreeting()
}
DialogueAPI 接口新增 generateGreeting,createSession 返回结构改变:
interface DialogueAPI {
createSession(config: SessionConfig): Promise<{ sessionId: string; totalRounds: number; currentRound: number; expiresAt: string | null }>
generateGreeting(sessionId: string): Promise<{ aiMessage: string }>
// speak / getReport 不变
}
SessionInfo 类型相应精简(去掉 aiMessage)。
MockDialogueAPI 同步拆:createSession 只返 mock sessionId;generateGreeting 返 mock 开场白。
TopicDiscussionPreview.vue"开始对话"按钮从"纯本地状态切换"改为"先调 createSession":
const sessionCreating = ref(false)
const sessionError = ref<string | null>(null)
const preparedSession = ref<{ sessionId: string; expiresAt: string | null } | null>(null)
async function startDialogue() {
if (sessionCreating.value) return
sessionCreating.value = true
sessionError.value = null
try {
const api = mode === 'real' ? new RealDialogueAPI() : new MockDialogueAPI()
const info = await api.createSession({
topic: speakingStore.config.topic || topic,
totalRounds: speakingStore.config.practice.rounds || totalRounds,
roleId: 'tom',
vocabulary: speakingStore.config.learningGoals.vocabulary,
})
preparedSession.value = { sessionId: info.sessionId, expiresAt: info.expiresAt }
dialogueState.value = 'chatting'
} catch (err: any) {
sessionError.value = friendlyErrorMessage(err?.message) || '创建会话失败,请重试'
} finally {
sessionCreating.value = false
}
}
模板改动:
sessionCreating 时变 disabled + 内嵌 spinner,文案可保持"开始对话"(或加省略号)sessionError 文案(非阻塞,按钮保持可点击,用户再次点击即重试)重启流程: resetPreview() 额外清 preparedSession.value = null。
DialogueChatView.vueProps 新增 sessionInfo:
interface Props {
// ... existing
sessionInfo?: { sessionId: string; expiresAt: string | null } | null
}
onMounted 改动:
engine.initSession(...)props.sessionInfo 存在 → engine.attachSession(props.sessionInfo) + engine.generateGreeting()error-card 重试按钮需要分支:
当前模板 DialogueChatView.vue:85-88:
<button class="retry-btn" @click="engine.regenerateAiMessage(message.id)">重新生成</button>
改为(在 msg-ai 分支内):
<button class="retry-btn" @click="retryAiMessage(message)">重新生成</button>
function retryAiMessage(message: PreviewChatMessage) {
// 第一条 AI 消息(前面没有学生消息)→ 走 retryGreeting
const idx = engine.messages.value.indexOf(message)
const hasPrevStudent = engine.messages.value.slice(0, idx).some(m => m.role === 'student')
if (!hasPrevStudent) {
engine.retryGreeting()
} else {
engine.regenerateAiMessage(message.id)
}
}
handleRestart 改动: 不再调 engine.initSession,改为走父组件 resetPreview 流程 —— 当前 handleRestart 在子组件内部直接重置状态并调 initSession,拆分后应由父组件发起"重新创建 session"。最简单的做法:handleRestart 触发一个 emit('restart') 事件,父组件接收后清状态回 ready。
llmService.tsRealDialogueAPI:
async createSession(config: SessionConfig): Promise<{ sessionId: string; ... }> {
const res = await fetch(`${API_BASE}/session`, { method: 'POST', ... })
if (!res.ok) throw new Error(`createSession failed: ${res.status}`)
return res.json() // 无 aiMessage 字段
}
async generateGreeting(sessionId: string): Promise<{ aiMessage: string }> {
const res = await fetch(`${API_BASE}/session/${sessionId}/greeting`, {
method: 'POST',
credentials: 'include',
})
if (!res.ok) {
const text = await res.text().catch(() => '')
throw new Error(`greeting failed: ${res.status}${text ? ` (${text.slice(0, 100)})` : ''}`)
}
return res.json()
}
friendlyErrorMessage 映射表(useDialogueEngine.ts:429-442)补充:
'Session not found': '会话已失效,请刷新页面重新开始', // 已有
'Session is not active': '会话已结束', // 已有
// 新加 LLM 失败时前端显示的中文文案:
'Greeting generation failed': '开场白生成失败,请重试', // 对应后端 500
后端 500 时前端拿不到稳定 error code,friendlyErrorMessage 对未知 message 回落到"请求失败,请重试"已可用。可不特殊处理,保留通用文案即可。
dialogue_service.py:create_session 拆成 create_session_only + generate_greeting(含幂等查现有消息)api/dialogue.py:/session 返回去掉 aiMessage;新增 POST /session/{session_id}/greeting 路由llmService.ts:DialogueAPI 接口扩展;Real/Mock 都实现 generateGreeting;createSession 返回类型更新useDialogueEngine.ts:拆 initSession → attachSession + generateGreeting + retryGreetingDialogueChatView.vue:接受 sessionInfo prop;onMounted 改为 attachSession + generateGreeting;error-card 重试分支;handleRestart 改走 emitTopicDiscussionPreview.vue:startDialogue 改为 async,持有 preparedSession;按钮 loading/error UI;接收子组件 restart 事件POST /session 响应体不含 aiMessagePOST /session/{id}/greeting 对同一 session 重复调用返回完全相同的 aiMessage 且 DB 中仅一条 round=1 AI 消息POST /session/{id}/greeting 对非 active session 返 409,对不存在 session 返 404regenerateAiMessage)行为不变/speak、/speak-stream、/report/greeting 可扩展 query 参数)expires_at 自然过期)