Zoho MCP客户端小工具

Zoho MCP客户端小工具是一个基于JavaScript实现的Zoho小工具,用于与Zoho MCP服务器和Claude AI代理进行交互,实现数据查询和通信功能。

  • by varunrathour1
  • JavaScript
  • 本地部署
  • 更新于
在 GitHub 查看 varunrathour1/Zoho_MCP_JS

使用说明

Zoho MCP小部件(JavaScript阶段)

此目录包含Zoho MCP客户端的JavaScript实现,旨在打包为Zoho Widget。

📚 Zoho小部件要求

基于 Zoho文档:

  1. 结构:小部件必须是包含条目HTML文件的ZIP文件(默认值 widget.html).
  2. 包装:必须使用Zoho CLI(zet pack)以创建有效的ZIP。
  3. 局限性:
    • 最大总大小为10MB。
    • 最多250个文件。
    • 小部件本身不运行服务器端代码(Node.js);它只是客户端。

🏗️ 建筑

该架构反映了Python原型,但适用于浏览器:

User Interface (HTML/CSS)
    ↓
Agent (JS)
  - Calls Claude API (via Proxy/Direct*)
    ↓
MCP Client (JS)
  - Calls Zoho MCP Server (HTTP)
    ↓
Zoho MCP Server

⚠️ 安全警告: 如果直接存储在代码中,则客户端小部件会公开API密钥。

  • 发展:我们可以使用本地代理或临时密钥。
  • 生产:您应该使用Zoho创建者函数或安全的后端代理来保存Claude API密钥。

📂 项目结构

Zoho_MCP_JS/
├── app/
│   ├── index.html        # Entry point
│   ├── css/
│   │   └── style.css     # Styles
│   └── js/
│       ├── app.js         # Main UI logic
│       ├── agent.js       # Claude AI Agent (claude-sonnet-4-6)
│       ├── mcp-client.js  # MCP Client
│       └── config.js      # Configuration
├── proxy_server.py        # CORS proxy for Claude API & Zoho MCP
├── package.json
├── plugin-manifest.json
└── README.md

🚀 如何在当地跑步

你需要 两个终端:一个用于CORS代理,一个用于web服务器。

  1. 启动CORS代理 (从浏览器调用Claude API和Zoho MCP时需要):

    python proxy_server.py
    

    这继续 http://localhost:8083 具有两个端点:

    • /anthropic -将请求代理到Claude API
    • /zoho --将请求代理到Zoho MCP服务器
  2. 启动web服务器:

    npm start
    

    开放时间: http://localhost:8000.

    从同一网络上的其他设备访问? 使用 http://192.168.x.x:8000。注意:您需要重新输入设置,因为localStorage是特定于浏览器/源的。

  3. 配置凭据 在浏览器中:

    • 点击 设置 在应用程序中。
    • 输入你的 API密钥.
    • 输入你的 Zoho MCP URL (例如。 https://crm-data-metadata-mcp-server-906941038.zohomcp.com/mcp/<your-id>/message).
    • 单击“保存”。
  4. 开始聊天--试试 “给我最新的5条线索”.

📦 如何为Zoho打包

  1. 安装Zoho命令行界面: npm install -g zoho-extension-toolkit
  2. 跑 zet pack 在目录中。
  3. 将生成的ZIP上传到Zoho Creator/CRM。