Music Composer Webmcp

WebMCP演示：音乐作曲家

该项目是对 WebMCP协议，说明了AI代理如何与本地浏览器上下文（工具）交互，以自主实现复杂的工作流程。

您可以在以下网址免费试用现场演示： https://music.leanmcp.live\ *（注意：您必须在中打开此链接 谷歌Chrome Canary 并在中启用WebMCP标志 chrome://flags 为了使WebMCP功能最好地工作，否则它将使用polyfill。)*

什么是WebMCP？

WebMCP（Web模型上下文协议）是PENDING标准，允许Web应用程序直接向浏览器或连接的AI代理注册“工具”。通过本机公开应用程序的功能，人工智能可以反思可用的工具并智能地执行任务。在这个特定的演示中，代理只使用WebMCP工具调用来编排基于web的音频序列器。

要阅读官方规范，请访问 webmcp.link.

本地设置

要在本地运行此协议演示，您需要LeanMCP API密钥和Google Chrome Canary。

1.要求

• 安装在您的机器上。
• 谷歌Chrome Canary实验性的WebMCP功能最好在最前沿的浏览器上进行测试。
• A. LeanMCP API代币.从 LeanMCP API按键面板.
• 足够的学分 在您的LeanMCP帐户上。管理您的账单 这里.

2.环境变量

导航到此目录(webmcp-react).复制示例环境文件以配置凭据：

cp .env.example .env

编辑 .env 并分配您的实际API令牌：

VITE_GATEWAY_API_KEY=your_actual_leanmcp_api_token_here

3.安装与运行

安装所需的npm依赖项并启动Vite开发服务器：

npm install
npm run dev

4.体验议定书

1. 打开 谷歌Chrome Canary.
2. 引导到 chrome://flags 并启用 WebMCP 实验特征。如果出现提示，请重新启动浏览器。
3. 导航到 localhost Vite服务器提供的URL（通常 http://localhost:5173).
4. 使用该接口启动代理运行。您将观察到底层WebMCP运行时将UI的功能作为工具暴露给LLM，LLM自主处理工作流并将操作调用回页面。