Skip to main content
Glama
WingkySky
by WingkySky

📊 交互式电子表格 MCP App

一个在 AI 对话中提供可交互电子表格的 MCP App,基于 Skybridge 框架构建。

✨ 特性

  • 📥 智能导入 - 支持 XLSX、CSV 格式

  • ✏️ 实时编辑 - 像 Excel 一样直接修改单元格

  • 📤 轻松导出 - 导出为 CSV

  • 🤖 MCP Apps 支持 - 在 Claude Code Desktop 中弹出交互式表格编辑器

  • 🔒 安全隔离 - iframe 沙箱渲染

🚀 快速开始

本地开发

# 1. 安装依赖
npm install

# 2. 启动开发服务器
npm run dev

# 3. 使用 cloudflared 隧道(可选,用于连接 Claude)
cloudflared tunnel --url http://localhost:3000

连接 Claude

使用 cloudflared 创建隧道,然后将隧道 URL 添加到 Claude 的 MCP 配置中:

{
  "mcpServers": {
    "spreadsheet": {
      "url": "https://xxx.trycloudflare.com/mcp"
    }
  }
}

部署到 Vercel

# 1. 安装 Vercel CLI
npm i -g vercel

# 2. 登录
vercel login

# 3. 部署
vercel --prod

部署后,MCP 端点地址为:https://your-app.vercel.app/mcp

📖 使用方法

在 Claude Code Desktop 中使用

  1. 配置 MCP Server:

{
  "mcpServers": {
    "spreadsheet": {
      "url": "https://your-app.vercel.app/mcp"
    }
  }
}
  1. 在对话中:

    • 上传 Excel/CSV 文件

    • 查看交互式表格

    • 编辑数据

    • 导出数据

工具说明

  • spreadsheet - 将数据展示为交互式电子表格

  • import_spreadsheet - 导入 Excel/CSV 文件并显示为表格

🛠 技术栈

  • 前端: React 19 + jspreadsheet-ce

  • 框架: Skybridge(MCP Apps 全栈框架)

  • 后端: Express 5 + MCP SDK

  • Excel 处理: SheetJS (xlsx)

  • 部署: Vercel / 任意 Node.js 服务器

📁 项目结构

spreadsheet-mcp-app/
├── server/
│   ├── src/
│   │   ├── index.ts       # Express 应用入口
│   │   ├── server.ts      # Skybridge McpServer + widget 注册
│   │   └── middleware.ts  # MCP 传输中间件
│   └── utils/
│       └── excel-parser.ts # Excel/CSV 解析器
├── web/
│   ├── src/
│   │   ├── helpers.ts     # 类型安全的 Skybridge hooks
│   │   ├── index.css      # Widget 样式
│   │   └── widgets/
│   │       └── spreadsheet.tsx # 电子表格 React 组件
│   └── vite.config.ts     # Vite 构建配置
├── package.json
├── tsconfig.json
└── README.md

📄 许可证

MIT License

-
license - not tested
-
quality - not tested
-
maintenance - not tested

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/WingkySky/spreadsheet-mcp-app'

If you have feedback or need assistance with the MCP directory API, please join our Discord server