type
status
date
slug
summary
tags
category
icon
password
文件和媒体
Chataide（智能聊天助手）
🚀 项目概览
Chataide 是一个基于 Next.js + React 的可嵌入智能聊天助手组件（ChatAIWidget）+ Cloudflare Workers 后端的完整聊天框架。
- 前端：
components/下的聊天组件（UI、历史、输入、多平台选择、文件/URL处理）
- 后端：
chatai-workers/目录的 Cloudflare Workers 服务（多 AI 提供商、文件与URL解析、KV/R2、自动密钥轮换）
支持：OpenAI、Anthropic Claude、Google Gemini，以及国内平台（通义、文心一言、智谱、MiniMax 等）。
🗂️ 目录结构
components/：UI 组件（ChatAIWidget、ChatAI、ChatInput、ChatMessages、AIProviderSelector 等）
hooks/useChatAI.js：聊天逻辑与状态管理 Hook
pages/：Next.js 页面入口
chatai-workers/：Workers 代码和部署配置
public/：静态资源
example.jsx：快速集成示例
🔧 快速开始
1. 克隆仓库
2. 安装依赖
3. 启动本地开发
- 前端（Next.js）
- 后端（Cloudflare Workers，本地模拟）
🧩 集成 ChatAIWidget
在你的页面中引用：
☁️ Cloudflare Workers 部署（详细请见
chatai-workers/README.md）- 安装 wrangler：
npm install -g wrangler
- 登录 Cloudflare：
wrangler login
- 配置
chatai-workers/wrangler.toml
- 配置 KV/R2/Secret（API_KEY 轮换配置）
- 部署：
wrangler deploy --env production
🔑 环境变量示例
.env.local（前端）Workers Secret（示例）：
✅ 功能亮点
- AI 平台一键切换（国际/国内）
- 聊天历史 + 多会话
- 文件上传（文档、图片、代码）
- URL 解析与摘要
- 可视化消息气泡 / 输入动画
- 权限与限额管理（QuotaStatus）
🧪 代码检查
npm run lint
npm test
📘 参考文档
- 组件文档：
components/README.md
- Workers 后端：
chatai-workers/README.md
📄 许可证
MIT
- 作者:Hucry Blog
- 链接://Chataide
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。
