大模型对话前端：流式输出要同时处理取消和安全

大模型对话前端：流式输出要同时处理取消和安全

流式对话不只是逐字追加。用户会中途停止、切换会话，网络也会断开；Markdown 还可能带来不受信任的链接和 HTML。

把一轮对话当成状态机

区分待发送、接收中、完成、取消和失败。每轮持有请求标识，旧流返回时先核对当前会话，避免覆盖新消息。

渲染层默认不信任内容

Markdown 使用白名单解析，禁用或过滤原始 HTML；链接补安全属性，代码块与长文本做增量渲染但不执行。

• 停止按钮向服务端传播取消。
• 断线保留已收到内容并说明状态。
• 错误消息不泄漏内部提示与请求细节。

体验指标对应操作路径

记录首 Token、流中断和渲染长任务，按消息长度分组。只报总响应时间，解释不了用户看到的卡顿。

对话界面要让用户随时知道系统在做什么，也要保证模型文本没有越过浏览器的安全边界。

原稿中的最小片段

const controller = new AbortController();

这段片段保留原样，只用于说明接口形态；接入项目时仍要补齐类型、错误和测试。