企业官网建设流程全解析

🎬 艾莉丝的简介：

1 ~> ChatServer 项目整体概述

1.1 项目定位

• 基于已封装完成的 ChatSDK，开发网页版智能聊天助手，对标豆包、DeepSeek 网页对话产品。
• 项目分为两大组成部分：ChatServer 后端服务器、Web 前端页面。
• 核心开发重心：ChatServer 后端服务；Web 前端由工具生成。
• ChatSDK 职责：完成与各类大模型底层交互逻辑，上层业务由 ChatServer 实现。

1.2 整体系统架构

1.2.1 架构数据流

1. Web 前端页面通过HTTP/HTTPS协议向 ChatServer 发送请求，接收服务端响应渲染页面。
2. ChatServer 接收前端请求，调用 ChatSDK 完成大模型交互。
3. ChatSDK 对接底层大模型（DeepSeek、Gemini、GPT‑4o‑mini、豆包等；本地模型可通过 Ollama 接入）。
4. 大模型返回结果经由 ChatSDK 解析处理，回传给 ChatServer。
5. ChatServer 将模型应答结果返回 Web 前端，完成对话展示；对话消息默认采用流式返回。

1.2.2 组件分工

• Web 前端：用户交互入口，负责会话展示、消息输入输出、模型选择、会话列表渲染。
• ChatServer：业务服务层，对外提供 HTTP 接口；管理会话生命周期，调用 ChatSDK 能力。
• ChatSDK：模型交互封装层，屏蔽不同大模型 API 差异，提供统一调用接口。
• 大模型服务：底层推理能力来源，支持在线 API 模型、Ollama 本地部署模型。

2 ~> ChatServer 业务功能需求

2.1 核心接口能力清单

ChatServer 需要对外提供如下业务接口，支撑全部网页端业务：

• 获取会话列表
• 获取服务器支持的全部模型列表
• 创建新会话
• 发送对话消息（流式响应）
• 获取指定会话的全部历史消息
• 删除指定会话

2.2 业务场景拆解

2.2.1 获取会话列表

• 触发时机：浏览器访问服务器地址加载首页时。
• 业务行为：前端获取并渲染全部历史会话，在页面左侧会话栏展示历史对话条目。

2.2.2 获取支持模型列表

• 触发时机：用户点击【新建对话】按钮。
• 业务行为：服务端返回所有已接入模型元信息（模型名称、能力标签、描述、在线 / 本地状态）；前端弹窗渲染可用模型卡片供用户选择。

2.2.3 创建会话

1. 用户选定目标模型，点击确认创建对话。
2. 前端发送请求通知 ChatServer 创建会话，绑定选中的大模型。
3. 服务端通过 ChatSDK 完成会话实例创建。
4. 前端关闭模型选择弹窗，切换进入聊天页面。

2.2.4 发送消息（流式返回）

1. 用户输入提问内容，点击发送按钮，前端将消息提交 ChatServer。
2. ChatServer 调用 ChatSDK 向绑定模型发起对话请求。
3. 模型结果以流式分片形式逐层返回，服务端将流透传给前端。
4. 前端逐步渲染模型输出内容，实现打字机对话效果。

2.2.5 获取会话历史消息

• 触发时机：用户点击左侧任意一条历史会话条目。
• 业务行为：前端请求该会话完整消息记录；服务端返回会话内全部历史问答；前端渲染历史消息，支持在该会话上下文继续对话。

2.2.6 删除会话

• 触发时机：用户在历史会话条目点击删除操作。
• 业务行为：服务端销毁指定会话实例，清除会话内全部历史消息；前端移除对应会话条目。

3 ~> 关键概念说明

3.1 会话 (Session)

• 会话是 ChatSDK 核心抽象；所有用户与模型的对话消息全部归属于会话实例。
• 每一个会话绑定一个确定的大模型；会话保存完整多轮对话上下文，用于大模型多轮记忆。
• 会话生命周期：创建 → 持续多轮消息交互 → 删除销毁。

3.2 流式响应

• 大模型对话主流交互模式；模型不会等待完整回答生成完毕再返回，而是逐段输出 token。
• 服务端需要将大模型输出流透传给前端，不需要在服务端完整缓存全部应答文本。

3.3 Ollama 接入本地模型

• Ollama 用于本地运行大模型；ChatSDK 可以对接 Ollama 服务，将本地部署模型纳入 ChatServer 可选择模型列表，实现本地大模型网页对话。

4 ~> 系统调用时序

1. 用户浏览器访问 ChatServer 地址，HTTP 请求拉取前端页面 + 获取会话列表。
2. 用户点击新建对话，请求模型列表，前端展示可用模型卡片。
3. 用户选择模型，调用创建会话接口，服务端通过 ChatSDK 生成绑定指定模型的会话。
4. 用户输入问题发送消息，前端提交消息；ChatServer 交给 ChatSDK 调用大模型。
5. 大模型流式输出 → ChatSDK 接收流 → ChatServer 透传流式数据给 Web 前端。
6. 用户点击历史会话：请求会话历史，加载过往聊天记录，继续多轮对话。
7. 用户执行删除会话：服务端销毁会话资源，会话不再可用。

结尾

uu们，本文的内容到这里就全部结束了，艾莉丝在这里再次感谢您的阅读！

艾莉丝努力练剑 C/C++ & Linux 底层探索者 | 一个正在努力练剑的技术博主 👀【关注】跟随我一起深耕技术领域，见证每一次成长。 ❤️【点赞】让优质内容被更多人看见，让知识传递更有力量。 ⭐【收藏】把核心知识点存好，在需要时随时查、随时用。 💬【评论】分享你的经验或疑问，评论区一起交流避坑！ 不要忘记给博主“一键四连”哦！ “今日练剑达成！” “技术之路难免有困惑，但同行的人会让前进更有方向。”

结语：希望对学习Linux相关内容的uu有所帮助，不要忘记给博主“一键四连”哦！

往期回顾：

【AI大模型接入SDK】C++ ChatSDK使用手册

🗡博主在这里放了一只小狗，大家看完了摸摸小狗放松一下吧！🗡૮₍ ˶ ˊ ᴥ ˋ˶₎ა