React 应用快速集成 MCP 客户端方案

我是 CopilotKit 团队的一员，很高兴地宣布：我们刚刚新增了对 MCP 的内置支持。这项更新已于今天正式上线。

对于不熟悉 CopilotKit 的读者，它是一个可自行托管的全栈框架，用于构建能够与用户交互的 Agent 和 Copilot。我们专注于让 Agent 在获得用户批准后接管你的应用、向用户说明它正在做什么，并为用户生成完全自定义的 UI。

欢迎前往 CopilotKit 的 GitHub 点个 ⭐️

什么是 MCP Client？

它是一种基于 Web 的 Client（这里使用 React），让你可以在自己的应用中与任意 MCP server 对话。你只需要一个 Composio 提供的 URL 即可开始使用。

MCP 让你能够以标准化方式将 LLM 连接到外部工具。现在，你可以直接在 React 应用中通过聊天界面与任何兼容 MCP 的 server 交互，而且不需要任何 Agent framework。

只需一条命令，就能在你自己的 Next.js 应用中开始与本地 MCP server 对话。

 copilotkit@latest init -m MCP

为了展示它的能力，我使用 MCP 将一个简单的自托管 ToDo 应用连接到了两个平台：

Asana——将博客创意作为任务发送到 Asana，分配给我自己，并设置截止日期。

Typefully——获取博客标题，并将它们保存为推文草稿。

MCP server：Composio

Agentic framework：无

代码已经开源，欢迎参与贡献。

GitHub：https://github.com/CopilotKit/copilotkit-mcp-demo

文档：https://docs.copilotkit.ai/guides/model-context-protocol

视频演示：https://x.com/CopilotKit/status/1917976289547522074

Twitter 公告：https://x.com/CopilotKit/status/1917976289547522074

非常期待听听大家正在把 MCP 连接到哪些应用！

欢迎在 Twitter 上关注 CopilotKit，来和我们打个招呼。如果你也想构建一些很酷的东西，欢迎加入我们的 Discord。

部分评论可能仅对已登录的访客可见。请登录以查看全部评论。

如需采取进一步措施，你可以考虑屏蔽此人和／或举报滥用行为。