STARWARCLOUD STARWAR.AI
返回市场
y-界面

y-界面

作者：luohy15165 星标更新：2025-09-08
安装使用来源：spider==github.com

项目介绍

y-gui 🚀

一个基于Web的图形界面，用于与支持多种AI模型的强大MCP（模型上下文协议）集成进行AI聊天交互。除了标准的聊天功能外，y-gui还利用MCP连接到Gmail、Google日历、图像生成服务等。

查看y-cli以获取命令行版本。

演示

演示

MCP在行动

了解y-gui如何使用MCP集成扩展AI能力：

✨ 特性

  • 💬 支持与AI模型进行互动聊天界面
  • 🤖 支持多种机器人配置（任何base_url/api_key/model组合）
  • 🔗 完整的MCP（模型上下文协议）集成系统，包括：
    • 📧 访问和管理Gmail
    • 📅 通过Google日历集成进行事件调度
    • 🖼️ 图像生成能力
    • 🧩 扩展框架，用于额外的MCP服务器和工具
  • 🔒 使用Auth0和Google登录的安全认证
  • 🌓 支持深色/浅色主题
  • 📝 所有聊天数据存储在Cloudflare D1中，便于访问和同步
  • 🔄 实时更新，使用SWR
  • 📱 响应式设计，适用于所有设备

架构

y-gui由两个主要组件组成：

  1. 前端：使用TypeScript、Tailwind CSS和SWR进行数据获取的React应用程序
  2. 后端：使用D1存储的Cloudflare Workers
flowchart TD
    Client[React Client] --> Worker[Cloudflare Worker]
    Worker --> D1[Cloudflare D1]
    Worker --> AI[AI Providers]

    subgraph "前端"
        Client --> Components[React Components]
        Components --> State[SWR State]
        State --> API[API Layer]
    end

    subgraph "后端"
        Worker --> Auth[Auth Middleware]
        Worker --> Storage[Storage Layer]
        Worker --> Provider[Provider Layer]
    end

⚡ 快速开始

先决条件

  1. Node.js和npm
  2. Cloudflare账户
  3. Auth0账户
  4. AI提供商的API密钥

安装

  1. 克隆仓库：

    git clone https://github.com/luohy15/y-gui.git
cd y-gui

  2. 安装依赖项：

    npm install

  3. 配置环境变量：

    • 在backend/wrangler.toml中配置Cloudflare Worker设置
    • 在frontend/src/index.tsx和backend/src/utils/auth.ts中更改auth0设置

  4. 构建资源：

    npm run build

  5. 部署cloudflare worker

    npm run deploy

🛠️ 开发

项目结构

y-gui/
├── frontend/               # React前端应用
│   ├── src/
│   │   ├── components/     # React组件
│   │   ├── contexts/       # React上下文
│   │   ├── utils/          # 工具函数
│   │   └── index.tsx       # 入口点
├── backend/                # Cloudflare Worker后端
│   ├── src/
│   │   ├── api/            # API端点
│   │   ├── middleware/     # 中间件
│   │   ├── repository/     # 数据访问
│   │   └── index.ts        # Worker入口
├── shared/                 # 前端和后端之间的共享代码
│   └── types/              # TypeScript类型定义
└── memory-bank/            # 项目文档

可用脚本

  • npm run dev: 启动前端和后端开发服务器
  • npm run dev:frontend: 仅启动前端开发服务器
  • npm run dev:backend: 仅启动后端开发服务器
  • npm run build: 构建前端和后端
  • npm run deploy: 将后端部署到Cloudflare Workers
  • npm run test: 运行测试

🔒 认证

y-gui使用Auth0进行认证，具有以下功能：

  • 统一登录
  • Google社交登录
  • 基于令牌的会话管理
  • 安全的API访问

🤖 机器人配置

y-gui支持具有以下属性的多个机器人配置：

  • 名称
  • 模型
  • 基础URL
  • API密钥
  • 打印速度
  • MCP服务器
  • API类型
  • 自定义API路径
  • 最大标记数
  • 推理努力

🔗 MCP服务器配置

MCP（模型上下文协议）服务器可以简单地配置如下：

  • 名称：MCP服务器的唯一标识符
  • URL：用于远程托管的MCP服务
  • Token：用于安全服务器访问的身份验证令牌

当前的MCP集成包括Gmail、Google日历、图像生成，并支持自定义服务器以连接几乎任何API或服务。

🌐 API端点

后端提供RESTful API端点用于：

  • 聊天操作
  • 机器人配置管理
  • MCP服务器配置管理
  • 认证

🔄 数据存储

  • 聊天数据存储在Cloudflare D1中
  • 机器人和MCP服务器配置存储在Cloudflare D1中
  • MCP集成数据通过授权的API连接安全地管理

🧩 使用的技术

  • 前端：React、TypeScript、Tailwind CSS、SWR、Auth0
  • 后端：Cloudflare Workers、D1
  • 集成：MCP服务器、OAuth2、Gmail API、Google日历API、图像生成API
  • 构建工具：Vite、Wrangler、TypeScript

📚 文档

更多详细的文档，请参阅memory-bank目录。

访问deepwiki页面以获取全面的项目文档和指南。

🤝 贡献

欢迎贡献！请随时提交Pull Request。

📄 许可证

此项目根据MIT许可证发布 - 详情见LICENSE文件。