6.8
深览指数
产品人人都是产品经理·东哥说AI··AI 生成
我花半天自己搭了个ChatGPT：多家模型随便切，还能看见AI怎么想
作者以自身实践，详细拆解了从零搭建一个类 ChatGPT 对话产品（支持多模型切换、流式输出、推理过程可见、代码高亮等）的全过程，前后端代码不到 2000 行。文章核心价值在于提供了一个高度可复用的工程架构（FastAPI + Next.js + 阿里云百炼），并坦诚分享了踩坑细节（React 严格模式副作用、推理模型历史消息处理等）。适合有技术背景、想为团队构建内部 AI 助手或定制化对话系统的读者参考，是一篇高密度的实操教程，而非泛泛的产品分析。原文 ↗
核心观点
- ▍从零搭建一个类 ChatGPT 的对话产品，前后端代码不到 2000 行，关键在于架构清晰与按步骤迭代。
- 01作者列出的核心驱动力有三：数据自主、模型自由（可切换阿里云百炼的 Qwen3.7、DeepSeek V4、GLM-5.2 等）、高度定制化。
- 02技术架构选型明确：后端 FastAPI (Python) + SQLite，前端 Next.js + Tailwind + Zustand，AI 接入通过兼容 OpenAI 格式的阿里云百炼实现。
- 03开发过程拆解为六个阶段：后端骨架 -> AI 模型接入（SSE 流式通信）-> 前端搭建 -> Markdown 渲染 -> 会话管理 -> 细节打磨（空状态、错误重试、深色主题）。
- 04针对推理模型，特别处理了“思考过程”与“正式回答”的分离，历史消息中只传正式回答，避免了思考过程干扰模型输出的问题。
- 05具体踩坑记录：React 18 严格模式导致状态更新回调重复执行，使用 ref 同步追内容解决；判断“首次对话”的时机错误导致无法生成标题，需要先计数再存消息。
反方 / 局限
- — 文章本质上是一篇技术实现复盘，并未讨论其方案在用户量增长、并发性能、安全防护（如 prompt injection）等方面的局限性，对大规模部署场景的参考价值有限。
5 分钟 · 4 卡片 · 12 资料
读原文 →