%20--%3e%3cdefs%3e%3cstyle%3e%20.st0%20{%20fill:%20%23061b40;%20}%20.st1%20{%20fill:%20%23306af1;%20}%20.st2%20{%20fill:%20%235ce5cf;%20}%20%3c/style%3e%3c/defs%3e%3cg%3e%3cpath%20class='st0'%20d='M55,10.5h9v3h-9v9h12V7.5h-12v3ZM64,19.5h-6v-3h6v3Z'/%3e%3cpolygon%20class='st0'%20points='69%2016.5%2078%2016.5%2078%2019.5%2069%2019.5%2069%2022.5%2081%2022.5%2081%2013.5%2072%2013.5%2072%2010.5%2081%2010.5%2081%207.5%2069%207.5%2069%2016.5'/%3e%3cpolygon%20class='st0'%20points='95%2010.5%2095%207.5%2083%207.5%2083%2022.5%2095%2022.5%2095%2019.5%2086%2019.5%2086%2016.5%2095%2016.5%2095%2013.5%2086%2013.5%2086%2010.5%2095%2010.5'/%3e%3cpath%20class='st0'%20d='M40,1.5v21h11.6l1.4-1.4v-7.6h0c0,0-1.4-1.5-1.4-1.5l1.4-1.4V2.9l-1.4-1.4h-11.6ZM50,19.5h-7v-6h7v6ZM50,10.5h-7v-6h7v6Z'/%3e%3c/g%3e%3cpath%20class='st1'%20d='M23.1,24L14.7,4.8l-4.9,11.2h3.8l-1.8,4H3.3L12.1,0H2C.9,0,0,.9,0,2v20c0,1.1.9,2,2,2h21.1Z'/%3e%3cpath%20class='st2'%20d='M34,0h-16.8l10.6,24h6.2c1.1,0,2-.9,2-2V2C36,.9,35.1,0,34,0ZM32.5,20h-4V4h4v16Z'/%3e%3c/svg%3e)
MCP Client Browser
什么是MCP Client Browser?
MCP Client Browser是一个让您能在网页浏览器中直接与AI模型对话的工具库。它使用标准的MCP协议与服务器通信，无需搭建后端即可实现智能对话功能。如何使用MCP Client Browser?
只需在网页应用中安装这个库，配置好MCP服务器地址，就可以开始发送请求和接收AI模型的响应。适用场景
适合需要在网页中集成AI聊天功能、智能写作助手或教育类交互应用的场景。主要功能
浏览器直接运行
完全在浏览器环境中运行，无需后端服务器支持
MCP协议支持
兼容Model Control Protocol标准，可与各种MCP服务器通信
Cherry模板集成
内置支持Cherry Studio的提示模板格式，简化对话流程设计
简单API
提供清晰易用的TypeScript接口，方便快速集成到各种前端项目
优势
轻量级前端解决方案，减少服务器负载
支持主流现代浏览器
灵活的模板系统可定制对话流程
良好的TypeScript类型支持
局限性
依赖MCP服务器支持CORS
需要服务器兼容Cherry提示模板规范
复杂对话场景可能需要额外开发
如何使用
安装库
通过npm或yarn安装mcp-client-browser包
%20--%3e%3cdefs%3e%3cstyle%3e%20.st0%20{%20fill:%20%230080ff;%20}%20%3c/style%3e%3c/defs%3e%3cpath%20class='st0'%20d='M16.2,11.1c.4.5.4,1.2,0,1.8l-4.7,7.1h-3.8l5.3-8L7.6,4h3.8l4.7,7.1Z'/%3e%3c/svg%3e)
初始化客户端
创建客户端实例并配置MCP服务器地址
发送请求
使用send方法发送请求并处理响应
使用案例
简单问答
实现基本的问答功能
模板对话
使用预定义模板进行结构化对话
多轮对话
保持对话上下文进行连续交流
常见问题
需要什么样的MCP服务器？
支持哪些浏览器？
如何处理敏感数据？
可以自定义模板吗？
相关资源
Cherry Studio GitHub
Cherry Studio项目主页
MCP协议文档
Model Control Protocol官方文档
示例项目
使用本库的演示项目
Figma Context MCP
Framelink Figma MCP Server是一个为AI编程工具（如Cursor）提供Figma设计数据访问的服务器，通过简化Figma API响应，帮助AI更准确地实现设计到代码的一键转换。
TypeScript
56.8K
4.5分
Duckduckgo MCP Server
已认证
DuckDuckGo搜索MCP服务器，为Claude等LLM提供网页搜索和内容抓取服务
Python
57.0K
4.3分
Firecrawl MCP Server
Firecrawl MCP Server是一个集成Firecrawl网页抓取能力的模型上下文协议服务器，提供丰富的网页抓取、搜索和内容提取功能。
TypeScript
97.2K
5分
Minimax MCP Server
MiniMax Model Context Protocol (MCP) 是一个官方服务器，支持与强大的文本转语音、视频/图像生成API交互，适用于多种客户端工具如Claude Desktop、Cursor等。
Python
45.5K
4.8分
Exa Web Search
已认证
Exa MCP Server是一个为AI助手（如Claude）提供网络搜索功能的服务器，通过Exa AI搜索API实现实时、安全的网络信息获取。
TypeScript
40.2K
5分
Baidu Map
已认证
百度地图MCP Server是国内首个兼容MCP协议的地图服务，提供地理编码、路线规划等10个标准化API接口，支持Python和Typescript快速接入，赋能智能体实现地图相关功能。
Python
39.0K
4.5分
Edgeone Pages MCP Server
EdgeOne Pages MCP是一个通过MCP协议快速部署HTML内容到EdgeOne Pages并获取公开URL的服务
TypeScript
25.5K
4.8分
Context7
Context7 MCP是一个为AI编程助手提供实时、版本特定文档和代码示例的服务，通过Model Context Protocol直接集成到提示中，解决LLM使用过时信息的问题。
TypeScript
72.0K
4.7分