火山引擎接口返回200且响应体有数据但网页空白，常见于流式接口（如/chat/completions?stream=true）未正确处理SSE或chunked响应，前端用res.json()解析导致挂起，需改用EventSource或fetch+ReadableStream逐块读取并解码。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
火山引擎接口返回200且响应体有数据，但网页始终空白、无任何渲染，常见于流式接口（如/chat/completions?stream=true）未正确处理SSE或chunked响应——浏览器收得到字节，却卡在解析阶段，前端JS既没报错也没更新DOM。
确认是否真为流式响应
打开浏览器开发者工具 → Network 面板 → 刷新页面 → 找到目标请求 → 点击查看 → 切到 Response 标签页。如果看到内容持续追加、滚动条自动下移、响应体以data:开头并带event:、id:等字段，就是SSE流式响应；如果看到一长串JSON块按\n\n分隔，就是纯text/event-stream格式的chunked流。这两种都【不能用fetch().then(res => res.json())直接解析】，否则会因等待完整响应而永久挂起。
若Response为空白但Status是200，立即切到Preview标签页：显示“Failed to load response data”说明后端已断开连接或未正确flush；显示乱码或截断内容，说明流未闭合或编码不一致。
检查前端接收逻辑是否适配流式格式
方法一：用EventSource原生API（仅支持SSE）
创建EventSource对象时必须传入完整URL，并确保服务端响应头含Content-Type: text/event-stream。若后端实际返回的是纯JSON chunk（无SSE包装），EventSource会静默失败，控制台无报错但onmessage永不触发。
方法二：用fetch + ReadableStream（兼容SSE和裸chunk）
调用fetch后，必须显式调用response.body.getReader()获取reader，再用while循环+done判断持续读取；【漏掉await reader.read()中的await，或忘记检查{ done: true }就跳出循环，会导致流提前终止】。示例关键代码：
const reader = response.body.getReader();
while(true) {
const { done, value } = await reader.read();
if (done) break;
const chunk = new TextDecoder().decode(value);
// 此处需按\n\n分割chunk，再逐条解析每段data:内容
}
排查服务端流式输出完整性
第一步：curl命令直连验证原始流
执行curl -N -H "Accept: text/event-stream" "https://ark.cn-beijing.volces.com/api/v3/chat/completions?stream=true" -H "Authorization: Bearer sk-xxx" -d '{"model":"skylark2-pro-4k","messages":[{"role":"user","content":"hi"}]}'，观察终端是否持续打印data: {...}\n\n。若几秒后自动退出且无输出，说明服务端未真正开启流式响应或被中间件拦截。
第二步：检查Spring Boot等后端框架是否禁用了响应缓冲
在application.yml中确认server.tomcat.uri-encoding=utf-8已设置，且spring.webflux.chunked-transfer=false（WebFlux场景下若设为true会强制启用Transfer-Encoding: chunked，与SSE冲突）。若使用ResponseEntity
第三步：绕过Nginx检查原始服务响应
在服务器本地执行curl -v http://localhost:8080/your-stream-endpoint，对比响应头中是否有Connection: keep-alive、Transfer-Encoding: chunked、Content-Type: text/event-stream三项。缺任意一项，浏览器都无法维持长连接接收流。
