火山引擎怎么把模型回复一段一段显示出来_火山引擎流式输出接入教程

秋萱酱_9172

秋萱酱_9172

2026-10-25

172人浏览

原创

火山引擎
火山引擎

火山引擎是一款面向企业的云计算与AI服务平台。

下载
必须开启流式输出,否则前端无法逐段渲染;需在模型配置中勾选“流式输出”,调用startvoicechat时llmconfig设stream: true,前端用eventsource或fetch+readablestream接收sse数据,代理层须禁用缓冲并透传text/event-stream头。

☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

火山引擎怎么把模型回复一段一段显示出来_火山引擎流式输出接入教程

要在火山引擎上实现模型回复逐段显示(即流式输出),必须让前端能实时接收并渲染服务端分块返回的文本,而不是等整段响应结束才一次性展示。这要求后端接口支持SSE或WebSocket协议,且前端具备解析流式数据的能力。

确认模型服务已启用流式返回

登录火山引擎大模型服务平台 → 进入「模型管理」→ 找到你正在使用的模型(如DeepSeek-R1、GLM-4或自定义部署模型)→ 点击「配置」→ 检查「响应模式」是否勾选「流式输出(stream)」。未开启时,所有响应将被缓冲至完整生成后才发出,前端无法分段渲染。

【必须开启流式输出,否则后续所有前端处理均无效】

调用startvoicechat时正确传入stream参数

在调用startvoicechat接口发起会话时,需在llmconfig中显式设置stream: true,例如:

{"model": "deepseek-r1", "stream": true, "temperature": 0.7}

若遗漏该字段,即使后端模型支持流式,平台也会默认走非流式路径。注意:部分旧版SDK可能将stream设为字符串"true",必须改为布尔值true,否则被忽略。

前端接收并逐段渲染SSE响应

方法一:使用EventSource原生API(适用于HTTP SSE)

创建EventSource实例,监听message事件,每次收到data:行就解码JSON并提取delta.text字段追加到页面容器中:

const es = new EventSource("/api/chat?session_id=abc");<br>es.onmessage = (e) => {<br>  const chunk = JSON.parse(e.data);<br>  if (chunk.delta?.text) {<br>    document.getElementById("output").innerHTML += chunk.delta.text;<br>  }<br>};

方法二:手动处理fetch + ReadableStream(兼容性更好,推荐)

用fetch发起带stream: true的请求,通过response.body.getReader()逐块读取,按data:分割后JSON解析。注意:火山引擎SSE响应末尾固定以data: [done]标识结束,收到此行应主动关闭reader。

方法三:WebSocket双工流(仅限语音/多模态场景)

若接入的是startvoicechat语音会话,实际使用WebSocket连接,需监听message事件并解析二进制帧中的UTF-8文本片段。此时每帧对应一个语义完整的句子片段,无需再按标点切分——但必须校验frame_type === TEXT_CHUNK,跳过音频帧和控制帧。

后端代理层透传流式头信息

如果你在火山引擎前部署了Nginx或云函数作为代理,必须确保以下三点:

① Nginx配置中添加:proxy_buffering off;、proxy_cache off;、chunked_transfer_encoding on;

② 云函数(如火山函数FaaS)需设置响应超时≥30秒,并禁用自动gzip压缩(否则流式数据被缓存打包)。

③ 所有中间层不得修改Content-Type,必须保持为text/event-stream(SSE)或application/octet-stream(WebSocket)。

任一环节缓冲或重写头信息,都会导致前端收不到分段数据,表现为长时间白屏后突然刷出全部文字。

相关专题

更多
Gradle插件开发入门教程
Gradle插件开发入门教程

本专题介绍Gradle插件开发的基本流程,涵盖插件类编写、自定义任务注册、扩展参数设计和插件应用方法,帮助你理解插件如何组织构建逻辑,减少多个项目之间的重复配置。

2026.10.22

20

11

Gradle Wrapper配置教程
Gradle Wrapper配置教程

本专题介绍Gradle Wrapper的基本作用,涵盖文件组成、生成方法、版本配置和任务调用,帮助你理解项目如何使用指定的Gradle版本,减少不同开发环境带来的构建差异。

2026.10.22

20

10

Golangci-lint检查器使用教程
Golangci-lint检查器使用教程

本专题整理Golangci-lint常用Linters的用途与配置方法,覆盖错误处理、无效代码、安全、复杂度、命名和依赖检查,帮助项目合理选规则。

2026.10.22

20

15

Gradle怎么构建Java项目
Gradle怎么构建Java项目

本专题介绍Gradle Java项目构建方法,涵盖Java插件配置、依赖声明、源码编译、测试执行和打包检查,帮助你理解各阶段的任务关系,逐步完成项目构建。

2026.10.22

0

10

PHP时间戳漏洞修复教程
PHP时间戳漏洞修复教程

本专题汇总PHP常见时间戳漏洞,包括2038年溢出、时区漂移、时间戳伪造、重放攻击、时间盲注与日志审计失效等,并给出升级64位环境、使用 DateTimeImmutable、统一UTC、严格超时校验、预处理绑定、hash_equals 比对等修复方案,帮助开发者快速排查和加固时间相关代码。

2026.10.22

20

25

Golangci-lint配置文件与规则设置
Golangci-lint配置文件与规则设置

本专题聚焦Golangci-lint YAML配置文件,讲清运行参数、规则启停、目录排除、问题过滤及严重级别设置,便于团队统一检查标准。

2026.10.22

20

15

Golangci-lint安装与入门教程
Golangci-lint安装与入门教程

本专题讲解Golangci-lint的安装、初始化、基础命令和首次代码检查,覆盖本地环境、Docker及多平台用法,帮助Go开发者快速上手。

2026.10.22

20

15

PHP2Shell高危漏洞修复教程
PHP2Shell高危漏洞修复教程

PHP2Shell漏洞是什么,哪些PHP版本和运行环境会受到影响,服务器应该如何检测与修复?本专题提供版本自查脚本、Linux与Docker升级命令、PHP-FPM和Apache排查步骤,以及修复验证、临时缓解和应急响应方案。

2026.10.22

100

12

剧云人物设定与关系管理教程
剧云人物设定与关系管理教程

本专题介绍剧云人物设定与关系管理,讲解角色小传、性格职业、人物目标、背景资料和关系网络的创建及维护方法。

2026.10.22

20

16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
腾讯元宝使用手册
腾讯元宝使用手册

共0课时 | 0人学习

DeepSeek手册
DeepSeek手册

共0课时 | 0人学习