mcpclient
基于Vercel AI SDK的浏览器LLM聊天客户端,支持SSE连接MCP并自动发现工具。
安装使用
复制下面这段提示词发给你的 AI(Claude / Cursor / TRAE / Codex / WorkBuddy 等),它会自动帮你完成安装:
帮我安装这个 AI Skill:mcpclient。 它的用途是:基于Vercel AI SDK的浏览器LLM聊天客户端,支持SSE连接MCP并自动发现工具。 完整的 Skill 内容见:https://321skill.com/skills/mcpclient/raw/index.md 请读取该页面内容,如果是 SKILL.md 格式直接安装,如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接,AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'帮我在这个网页应用里添加一个AI聊天侧边栏,并且能调用后端的天气查询和计算器工具。',它会引导你使用 mcpclient 快速集成 Vercel AI SDK 的聊天 UI 组件,并配置 SSE 连接到你的 MCP 服务器,自动将后端注册的天气和计算器工具作为聊天功能的一部分提供。
介绍
mcpclient 旨在解决开发者在浏览器环境中快速集成和使用大型语言模型(LLM)进行聊天交互的复杂性问题。它基于 Vercel AI SDK 构建,简化了前端与 LLM 服务的连接和通信流程。
通过支持 Server-Sent Events (SSE) 协议连接 Model Context Protocol (MCP),该工具能够自动发现和调用后端提供的各种工具,极大地降低了开发者手动配置和集成工具链的工作量。
它非常适合前端开发、全栈开发以及智能体开发者,特别是那些希望在 Web 应用中快速集成 AI 对话能力,并需要灵活调用后端工具或服务的场景。
建议在使用前确保后端 MCP 服务已正确配置并运行。由于依赖 SSE 和特定协议,在需要极低延迟或复杂双向通信的场景下可能需要评估其他方案。
核心特点
核心区别在于其深度集成 Vercel AI SDK 以简化前端 LLM 集成,并原生支持通过 SSE 连接 MCP 协议,能够自动发现和调用后端工具,无需开发者手动编写大量胶水代码来桥接前端与工具服务。
注意事项
不适合需要复杂双向实时通信(如 WebSocket 全双工)或脱离浏览器 Node.js 环境的纯后端工具调用场景。
常见问题
mcpclient 和直接使用 Vercel AI SDK 有什么区别?
mcpclient 在 Vercel AI SDK 基础上,增加了对 MCP 协议的原生 SSE 连接支持和工具自动发现功能,简化了与后端工具服务的集成。
使用 mcpclient 需要自己部署 MCP 服务器吗?
是的,mcpclient 是一个前端客户端,需要连接到一个实现了 MCP 协议的后端服务器才能自动发现和使用工具。
给 AI 助手的安装指引
如果你的 AI 编程助手(Claude Code、Cursor、TRAE 等)能看到这个页面,把下面这段发给它即可自动完成安装:
请访问 https://321skill.com/skills/mcpclient/raw/index.md 读取 mcpclient 的原始 Skill 定义(Markdown 格式),按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址:/skills/mcpclient/raw/index.md(查看排版版本)