Botgroup.chat：超有趣的开源 AI 聊天室！多个 AI 在线互怼，一键搭建你的专属 AI 社群

❤️ 如果你也关注 AI 的发展现状，且对 AI 应用开发感兴趣，我会每日分享大模型与 AI 领域的开源项目和应用，提供运行实例和实用教程，帮助你快速上手AI技术！

🥦 AI 在线答疑 -> 智能检索历史文章和开源项目 -> 丰富的 AI 工具库 -> 每日更新 -> 尽在微信公众号 -> 搜一搜：蚝油菜花 🥦

💥 "还在和单个AI尬聊？20个智能体组团怼你才是真未来！"

大家好，我是蚝油菜花。当别人还在小心翼翼调教单个ChatGPT时，硬核玩家已经开始训练AI辩论队了！你是否遇到过：

👉 想比较不同AI模型的回答，要反复切换多个网页
👉 测试知识边界时，单个AI的认知局限让人抓狂
👉 调试对话逻辑时，缺乏多视角反馈就像闭门造车...

今天要安利的 Botgroup.chat ，正在GitHub掀起AI社交新浪潮！这个开源神器能让你：

✅ 创建AI版微信群：千问/混元/豆包多模型同台竞技
✅ 自定义角色人格：打造毒舌杠精、学术大佬等专属AI
✅ 实时流式互怼：看不同AI为数学题吵得不可开交
✅ 禁言玩控场：随时让话痨AI闭嘴，掌握对话主导权

已有开发者用它搭建AI评审团------产品需求丢进群聊，立刻获得多维度评估报告。想用React+Cloudflare搭建自己的智能体社群吗？三分钟部署教程马上开始！

🚀 快速阅读

Botgroup.chat 是一款开源的 AI 聊天应用，支持多个 AI 角色同时参与对话。

核心功能：支持多人 AI 群聊、自定义 AI 角色、多种模型支持、实时互动和群组管理功能。
技术原理：基于 React 框架开发前端，使用 Cloudflare Pages 进行后端部署，支持多种 AI 模型集成和流式响应。

Botgroup.chat 是什么

Botgroup.chat 是一款基于 React 和 Cloudflare Pages 的开源 AI 聊天应用，支持多个 AI 角色同时参与对话，提供类似群聊的交互体验。用户可以自定义 AI 角色的性格和模型，可以对特定 AI 进行禁言操作。创新的聊天方式让用户能体验与多个 AI 一起交流，类似于在一个虚拟的社交群组中。

Botgroup.chat 不仅支持多种 AI 模型，如千问、混元、豆包等，还提供了丰富的功能，如 Markdown 格式支持、数学公式显示等，适合娱乐、教育或测试场景。

Botgroup.chat 的演示截图

Botgroup.chat 的主要功能

多人 AI 群聊：支持多个 AI 角色同时参与对话，模拟真实的群聊场景。用户可以在聊天界面中与多个 AI 角色进行实时互动。
自定义 AI 角色：用户可以定义 AI 角色的名称、性格、模型及头像，打造个性化的智能体。
多种模型支持：兼容多种 AI 模型，如千问、混元、豆包等，满足不同用户的需求。用户可以根据需要切换不同的模型。
一键部署：通过 Cloudflare Pages 实现快速部署，无需复杂配置。用户可以轻松将项目部署到自己的服务器上。
实时互动：提供流畅的对话体验，适合娱乐、教育或测试场景。用户可以连续对话，观察不同角色的响应风格。
群组管理功能：支持群组管理，包括添加、删除角色，以及禁言功能。
支持 Markdown 格式：用户可以在聊天中使用 Markdown 格式，方便排版和展示。
支持数学公式显示：支持 KaTeX 数学公式显示，适合学术讨论。
开源代码：项目代码在 GitHub 上开放，开发者可以自由修改和扩展功能。

Botgroup.chat 的技术原理

前端开发：Botgroup.chat 的前端基于 React 框架开发。在 Botgroup.chat 中，React 负责渲染聊天界面、处理用户输入以及显示 AI 角色的回复。
后端部署：后端部署使用了 Cloudflare Pages。用户可以通过 GitHub 将项目代码 Fork 到自己的仓库，然后通过 Cloudflare Dashboard 进行配置和部署。
AI 模型集成：Botgroup.chat 支持多种 AI 模型，包括但不限于千问、混元、豆包等。模型通过 API 调用与应用进行交互。用户可以在配置文件中指定不同角色所使用的模型，通过环境变量来管理 API Key 和模型的 URL。
实时响应：应用实现了流式响应，即用户在发送消息后，AI 的回复会以类似打字机的效果实时显示。通过调用 AI 模型的流式 API 实现的。在后端，使用了 OpenAIStream 和 StreamingTextResponse 等技术来处理流式数据。
上下文记忆：为了使对话更加连贯，Botgroup.chat 实现了基于向量数据库的上下文记忆系统。使用了 Pinecone 和 OpenAI 的嵌入式模型来存储和检索对话历史。当用户发送新消息时，系统会根据上下文检索相关的对话历史，将其作为上下文信息传递给 AI 模型。
角色管理：用户可以自定义 AI 角色的名称、性格、模型和头像。角色的配置信息存储在项目的配置文件中。用户可以通过修改配置文件来添加或删除角色，重新部署应用以生效。

如何运行 Botgroup.chat

Cloudflare Pages 一键部署

1. Fork 项目到你的 GitHub 账号

点击Fork项目，将项目 Fork 到你的 GitHub 账号。

Fork项目 ：github.com/maojindao55...

2. 登录 Cloudflare Dashboard

进入 Cloudflare Dashboard。
Cloudflare Dashboard ：dash.cloudflare.com/
在左侧导航栏中选择 Workers & Pages 页面。
点击 Create a application > Pages 按钮。
选择 Connect to Git，连接到你 Fork 的仓库。

3. 配置部署选项

选择你 Fork 的仓库。
设置以下构建配置：
- Framework preset : None
- Build command : npm run build
- Build output directory : dist
设置环境变量（必须）：

plaintext 复制代码

DASHSCOPE_API_KEY=xxx // 千问模型 KEY  
HUNYUAN_API_KEY=xxx // 混元模型 KEY  
ARK_API_KEY=xxx // 豆包模型 KEY

4. 点击 "Save and Deploy"

Cloudflare Pages 会自动构建和部署你的应用。
部署完成后，可以通过分配的域名访问你的应用。

注意：首次部署后，后续的代码更新会自动触发重新部署。

自定义配置（可选）

1. 配置模型和 AI 角色

在 config/aiCharacters.ts 文件中，可以自定义模型和 AI 角色。

配置模型

typescript 复制代码

{
  model: string;     // 模型标识，按照服务方实际模型名称配置
  apiKey: string;    // 模型的 API 密钥
  baseURL: string;   // 模型的 baseURL
}

配置 AI 角色

typescript 复制代码

{
  id: string;        // 角色唯一标识
  name: string;      // 角色显示名称
  personality: string; // 角色性格描述
  model: string;     // 使用的模型，从 modelConfigs 中选择
  avatar?: string;   // 可选的头像 URL
  custom_prompt?: string;  // 可选的自定义提示词
}

示例配置：

typescript 复制代码

{
  id: "assistant1",
  name: "小助手",
  personality: "友善、乐于助人的 AI 助手",
  model: "qwen", // 注意：豆包的配置需要填写火山引擎的接入点
  avatar: "/avatars/assistant.png",
  custom_prompt: "你是一个热心的助手，擅长解答各类问题。"
}

2. 配置群组

在 config/groups.ts 文件中，可以配置群组信息。

typescript 复制代码

{
  id: string;        // 群组唯一标识
  name: string;      // 群组名称
  description: string; // 群组描述
  members: string[]; // 群组成员 ID 数组
}

示例配置：

typescript 复制代码

{
  id: "group1",
  name: "AI 交流群",
  description: "AI 角色们的日常交流群",
  members: ["ai1", "ai2", "ai3"] // 成员 ID 需要与 aiCharacters.ts 中的 id 对应
}

注意事项：

members 数组中的成员 ID 必须在 aiCharacters.ts 中已定义。
每个群组必须至少包含两个成员。
群组 ID 在系统中必须唯一。

本地环境启动与调试

由于本项目后端 server 使用的是 Cloudflare Pages Function（本质是 Worker），因此本地部署需要安装 wrangler。

1. 安装 wrangler

运行以下命令安装 wrangler：

bash 复制代码

npm install wrangler --save-dev

2. 使用启动脚本

运行以下命令启动本地开发环境：

bash 复制代码

sh devrun.sh

本地默认预览地址是：http://127.0.0.1:8788

资源

GitHub 仓库 ：github.com/maojindao55...

🥦 AI 在线答疑 -> 智能检索历史文章和开源项目 -> 丰富的 AI 工具库 -> 每日更新 -> 尽在微信公众号 -> 搜一搜：蚝油菜花 🥦