[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$fgTzqGkrwJWVYfzNXb6qYJyaWrP5F6Qwz_oCBMFcWbbk":3},{"item":4,"related":43},{"id":5,"type":6,"title":7,"slug":8,"summary":9,"body":10,"coverUrl":11,"productScreenshots":12,"productLinks":13,"authorName":14,"authorUrl":15,"authorSubject":16,"category":17,"tags":22,"sourceLabel":35,"sourceName":35,"sourceUrl":35,"status":36,"seoTitle":35,"seoDescription":35,"canonicalUrl":35,"isFeatured":37,"sno":38,"sortOrder":39,"publishedAt":40,"updatedAt":41,"createdAt":42},"17c9d7d9-d055-47e1-a10e-b14b31d7352d","article","流式输出：让 AI 回答像打字机一样逐字蹦出来","llm-streaming-sse-response","ChatGPT 的答案是逐字蹦出来的，背后是 SSE 流式输出。本文讲清为什么不能一次返回、SSE 是什么、给出 Flask 生成器 + EventSource 最小可运行示例，以及前端增量拼接、代理缓冲等工程边界。","你用 ChatGPT 时，答案是一个字一个字蹦出来的，不是憋半天一次性弹出。这叫流式输出，背后大多是 SSE（Server-Sent Events）。它不改变答案本身，却极大改善了「等待感」——让用户知道「它在动」。\n\n## 背景：为什么不能一次返回\n\nLLM 是自回归逐 token 生成的，全部生成完再返回，用户要干等好几秒甚至更久，体验很差，还容易以为卡死了。流式把已生成的 token 立刻推给前端，边生成边显示。\n\n## SSE 是什么\n\nSSE 是基于 HTTP 的单向推送：服务端用 `text\u002Fevent-stream` 持续发送 `data: ...\\n\\n` 这样的数据块，浏览器用 `EventSource` 接收。相比 WebSocket，它更轻量，专做「服务器 → 客户端」的单向流，且天然走普通 HTTP、好穿代理。\n\n```mermaid\nsequenceDiagram\n    participant U as 前端\n    participant S as 服务端\n    U->>S: 发起请求\n    loop 逐 token\n        S-->>U: data: 片段\n        U->>U: 渲染到页面\n    end\n```\n\n## 一个最小可运行的例子\n\n后端用生成器持续推送（Flask 风格）：\n\n```python\nfrom flask import Response\nimport time\n\ndef event_stream():\n    for token in generate_tokens():   # 逐 token 推送\n        yield f\"data: {token}\\n\\n\"\n        time.sleep(0.05)\n\n@app.route(\"\u002Fchat\")\ndef chat():\n    return Response(event_stream(), mimetype=\"text\u002Fevent-stream\")\n```\n\n前端用 `EventSource` 接收并拼接：\n\n```javascript\nconst es = new EventSource(\"\u002Fchat\");\nes.onmessage = (e) => {\n  output.textContent += e.data;   \u002F\u002F 逐字拼接到页面\n};\n```\n\n## 取舍与边界\n\n- **前端逻辑更复杂**：要处理「增量拼接」与渲染，比一次性返回麻烦不少。\n- **中途出错难处理**：已经开始流了，报错只能中断或补一句，没法整体回滚。\n- **代理\u002F网关要支持分块**：有些中间件会缓冲响应，把流式又攒成大块，要显式关闭缓冲。\n- **不是所有场景都要流**：内部批处理、离线评测可一次性返回，省事。\n\n## 你能马上用起来的收获清单\n\n- 任何面向用户的生成接口，默认上流式，体感提升立竿见影。\n- 前端用 `EventSource` 或 `fetch` + `ReadableStream` 消费分块。\n- 检查你的反向代理（Nginx 等）是否缓冲了响应，必要时关掉。\n- 给流式加「超时 \u002F 中止」按钮，用户能随时打断。\n- 批处理、评测类后台任务不必流式，保持简单。","https:\u002F\u002Foxqtewbrpuiouqqjrvdv.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fpublic-media\u002F2026-07-20\u002Fdd6f584f-7007-4827-9381-c3226ef72acd.jpg",[],[],"Foundit AI","https:\u002F\u002Ffoundit.cn","f39339b1-aaa6-4e86-b0c2-a6e6a21113b5",{"id":18,"name":19,"slug":20,"description":21},"6179d3b6-dc34-4483-9ded-3cd9f1b37a47","科普","abbreviation","介绍各领域新兴概念",[23,27,31],{"id":24,"name":25,"slug":26},"88d2bc27-0e0f-468a-b907-2991cb97b87b","人工智能","ai",{"id":28,"name":29,"slug":30},"4c2bbea6-eab7-40a8-8447-1de478ff7749","分析","analyse",{"id":32,"name":33,"slug":34},"7c76bfc2-f80f-4ee0-a95d-27bd8708b434","技术","slug",null,"published",false,78,0,"2026-07-03T00:00:00.000Z","2026-07-20T11:27:06.116Z","2026-07-20T10:23:25.927Z",[44,54,63],{"id":45,"type":6,"title":46,"slug":47,"summary":48,"coverUrl":49,"authorName":50,"sno":51,"publishedAt":52,"createdAt":53},"f00e5274-8e0b-40fe-af3b-b6a8d0183b9c","一张贴纸就能骗过视觉 AI？对抗样本不是魔法","adversarial-examples-fool-visual-ai","人眼仍能认出的物体，经过精心设计的微小扰动或标记后，机器却可能改变判断。这类输入称为对抗样本。本文解释攻击者如何利用模型的决策边界，现实攻击为何比实验更难，以及为什么目前不存在一劳永逸的防御。","\u002Fuploads\u002F2026-09-08\u002F151f887b-c5f1-4647-b369-cdda8a1e1b4f.jpg","Foundit",50,"2026-09-03T00:00:00.000Z","2026-08-14T03:06:09.765Z",{"id":55,"type":6,"title":56,"slug":57,"summary":58,"coverUrl":59,"authorName":50,"sno":60,"publishedAt":61,"createdAt":62},"305492d4-c146-456a-b341-31140ab9cafd","天气预报不再一格一格算空气，AI 是怎么预测风暴的？","how-ai-weather-forecasting-works","传统数值预报依据物理方程推进大气状态，AI 天气模型则从历史观测与再分析数据中学习状态如何演变。本文以 GraphCast 为例，解释图神经网络如何快速预测全球天气、它与传统方法如何协作，以及极端天气仍有哪些难点。","\u002Fuploads\u002F2026-08-16\u002Fa8b5ddad-d6db-4d12-a159-87a6c5309082.jpg",60,"2026-08-16T00:00:00.000Z","2026-08-14T03:06:12.102Z",{"id":64,"type":6,"title":65,"slug":66,"summary":67,"coverUrl":68,"authorName":50,"sno":60,"publishedAt":69,"createdAt":70},"7f962194-e0c6-4072-9b50-c70054beb0e5","同一个问题问三遍，AI 为什么会给出三个答案？","why-ai-gives-different-answers-sampling","大模型每次回答都在从候选词中继续选择，而不是从数据库里取出一段固定文字。温度、Top-p 和随机采样共同决定回答更稳定还是更有变化。本文用抽签与岔路的比喻，解释 AI 的随机性从哪里来，以及什么时候应该追求一致。","\u002Fuploads\u002F2026-08-14\u002Fb322d338-b5c0-48c7-addf-fbd91421e316.jpg","2026-08-14T00:00:00.000Z","2026-08-14T03:06:07.351Z"]