https://github.com/hangwin/mcp-chrome
1. 关于 mcp-chrome 的可能性
是的,基于 mcp-chrome (即 hangwin/mcp-chrome ) 确实可以实现非常多的可能性,它通过 MCP 协议将浏览器变成了 AI 的”手眼”。
核心优势与可能性:
- 复用用户会话 :最大的亮点是它直接通过 Chrome 扩展连接你现有的浏览器,这意味着它可以 直接复用你的登录状态 (Cookies、Local Storage)。AI 可以直接操作你已经登录的 Gmail、GitHub、Notion 等,而不需要重新处理复杂的认证流程。
- 所见即所得的自动化 :因为是基于真实浏览器的 DOM 和 CDP (Chrome DevTools Protocol),它能处理复杂的动态网页(SPA),不仅是”看”(截图/读取内容),还能”做”(点击、输入、滚动)。
- 语义化搜索与交互 :结合 MCP 的能力,你可以用自然语言发出指令(如”帮我把所有未读邮件的标题整理成摘要”),它将其转化为具体的浏览器操作。
- 数据提取与工作流集成 :可以作为数据采集器,将网页数据直接喂给其他 MCP 工具(如写入数据库、发送到 Slack)。
Chrome MCP Server 🚀
🌟 让chrome浏览器变成你的智能助手 - 让AI接管你的浏览器,将您的浏览器转变为强大的 AI 控制自动化工具。
🎯 什么是 Chrome MCP Server?
Chrome MCP Server 是一个基于chrome插件的 模型上下文协议 (MCP) 服务器,它将您的 Chrome 浏览器功能暴露给 Claude 等 AI 助手,实现复杂的浏览器自动化、内容分析和语义搜索等。与传统的浏览器自动化工具(如playwright)不同,Chrome MCP server直接使用您日常使用的chrome浏览器,基于现有的用户习惯和配置、登录态,让各种大模型或者各种chatbot都可以接管你的浏览器,真正成为你的日常助手
✨ 船新的功能(2025/12/30)
- 让Claude Code/Codex也能使用的可视化编辑器, 更多详情请看: VisualEditor
✨ 核心特性
- 😁 chatbot/模型无关:让任意你喜欢的llm或chatbot客户端或agent来自动化操作你的浏览器
- ⭐️ 使用你原本的浏览器:无缝集成用户本身的浏览器环境(你的配置、登录态等)
- 💻 完全本地运行:纯本地运行的mcp server,保证用户隐私
- 🚄 Streamable http:Streamable http的连接方式
- 🏎 跨标签页 跨标签页的上下文
- 🧠 语义搜索:内置向量数据库和本地小模型,智能发现浏览器标签页内容
- 🔍 智能内容分析:AI 驱动的文本提取和相似度匹配
- 🌐 20+ 工具:支持截图、网络监控、交互操作、书签管理、浏览历史等20多种工具
- 🚀 SIMD 加速 AI:自定义 WebAssembly SIMD 优化,向量运算速度提升 4-8 倍
🆚 与同类项目对比
| 对比维度 | 基于Playwright的MCP Server | 基于Chrome插件的MCP Server |
|---|---|---|
| 资源占用 | ❌ 需启动独立浏览器进程,需要安装Playwright依赖,下载浏览器二进制等 | ✅ 无需启动独立的浏览器进程,直接利用用户已打开的Chrome浏览器 |
| 用户会话复用 | ❌ 需重新登录 | ✅ 自动使用已登录状态 |
| 浏览器环境保持 | ❌ 干净环境缺少用户设置 | ✅ 完整保留用户环境 |
| API访问权限 | ⚠️ 受限于Playwright API | ✅ Chrome原生API全访问 |
| 启动速度 | ❌ 需启动浏览器进程 | ✅ 只需激活插件 |
| 响应速度 | 50-200ms进程间通信 | ✅ 更快 |
🚀 快速开始
环境要求
- Node.js >= 20.0.0 和 (npm 或 pnpm)
- Chrome/Chromium 浏览器
安装步骤
- 从github上下载最新的chrome扩展
下载地址:https://github.com/hangwin/mcp-chrome/releases
记得解压

加载 Chrome 扩展
- 打开 Chrome 并访问
chrome://extensions/ - 启用”开发者模式”
- 点击”加载已解压的扩展程序”,选择
your/dowloaded/extension/folder - 点击插件图标打开插件,点击连接即可看到mcp的配置
- 打开 Chrome 并访问
全局安装mcp-chrome-bridge
npm
npm install -g mcp-chrome-bridgepnpm
# 方法1:全局启用脚本(推荐)
pnpm config set enable-pre-post-scripts true
pnpm install -g mcp-chrome-bridge
# 方法2:如果 postinstall 没有运行,手动注册
pnpm install -g mcp-chrome-bridge
mcp-chrome-bridge register注意:pnpm v7+ 默认禁用 postinstall 脚本以提高安全性。
enable-pre-post-scripts设置控制是否运行 pre/post 安装脚本。如果自动注册失败,请使用上述手动注册命令。
在支持MCP协议的客户端中使用
使用streamable http的方式连接(👍🏻推荐)
将以下配置添加到客户端的 MCP 配置中以cherryStudio为例:
推荐用streamable http的连接方式
{
"mcpServers": {
"chrome-mcp-server": {
"type": "streamableHttp",
"url": "http://127.0.0.1:12306/mcp"
}
}
}使用stdio的方式连接(备选)
假设你的客户端仅支持stdio的连接方式,那么请使用下面的方法:
- 先查看你刚刚安装的npm包的安装位置
# npm 查看方式
npm list -g mcp-chrome-bridge
# pnpm 查看方式
pnpm list -g mcp-chrome-bridge假设上面的命令输出的路径是:/Users/xxx/Library/pnpm/global/5
那么你的最终路径就是:/Users/xxx/Library/pnpm/global/5/node_modules/mcp-chrome-bridge/dist/mcp/mcp-server-stdio.js
- 把下面的配置替换成你刚刚得到的最终路径
{
"mcpServers": {
"chrome-mcp-stdio": {
"command": "npx",
"args": [
"node",
"/Users/xxx/Library/pnpm/global/5/node_modules/mcp-chrome-bridge/dist/mcp/mcp-server-stdio.js"
]
}
}
}比如:在augment中的配置如下:
🛠️ 可用工具
完整工具列表:完整工具列表
📊 浏览器管理 (6个工具)
get_windows_and_tabs- 列出所有浏览器窗口和标签页chrome_navigate- 导航到 URL 并控制视口chrome_switch_tab- 切换当前显示的标签页chrome_close_tabs- 关闭特定标签页或窗口chrome_go_back_or_forward- 浏览器导航控制chrome_inject_script- 向网页注入内容脚本chrome_send_command_to_inject_script- 向已注入的内容脚本发送指令
📸 截图和视觉 (1个工具)
chrome_screenshot- 高级截图捕获,支持元素定位、全页面和自定义尺寸
🌐 网络监控 (4个工具)
chrome_network_capture_start/stop- webRequest API 网络捕获chrome_network_debugger_start/stop- Debugger API 包含响应体chrome_network_request- 发送自定义 HTTP 请求
🔍 内容分析 (4个工具)
search_tabs_content- AI 驱动的浏览器标签页语义搜索chrome_get_web_content- 从页面提取 HTML/文本内容chrome_get_interactive_elements- 查找可点击元素chrome_console- 捕获和获取浏览器标签页的控制台输出
🎯 交互操作 (3个工具)
chrome_click_element- 使用 CSS 选择器点击元素chrome_fill_or_select- 填充表单和选择选项chrome_keyboard- 模拟键盘输入和快捷键
📚 数据管理 (5个工具)
chrome_history- 搜索浏览器历史记录,支持时间过滤chrome_bookmark_search- 按关键词查找书签chrome_bookmark_add- 添加新书签,支持文件夹chrome_bookmark_delete- 删除书签
🧪 使用示例
ai帮你总结网页内容然后自动控制excalidraw画图
prompt: excalidraw-prompt
指令:帮我总结当前页面内容,然后画个图帮我理解
https://www.youtube.com/watch?v=3fBPdUBWVz0
https://github.com/user-attachments/assets/f14f79a6-9390-4821-8296-06d020bcfc07
ai先分析图片的内容元素,然后再自动控制excalidraw把图片模仿出来
prompt: excalidraw-prompt|content-analize
指令:先看下图片是否能用excalidraw画出来,如果则列出所需的步骤和元素,然后画出来
https://www.youtube.com/watch?v=tEPdHZBzbZk
https://github.com/user-attachments/assets/4f0600c1-bb1e-4b57-85ab-36c8bdf71c68
ai自动帮你注入脚本并修改网页的样式
prompt: modify-web-prompt
指令:帮我修改当前页面的样式,去掉广告
https://youtu.be/twI6apRKHsk
https://github.com/user-attachments/assets/aedbe98d-e90c-4a58-a4a5-d888f7293d8e
ai自动帮你捕获网络请求
指令:我想知道小红书的搜索接口是哪个,响应体结构是什么样的
https://youtu.be/1hHKr7XKqnQ
https://github.com/user-attachments/assets/dc7e5cab-b9af-4b9a-97ce-18e4837318d9
ai帮你分析你的浏览记录
指令:分析一下我近一个月的浏览记录
https://youtu.be/jf2UZfrR2Vk
https://github.com/user-attachments/assets/31b2e064-88c6-4adb-96d7-50748b826eae
网页对话
指令:翻译并总结当前网页
https://youtu.be/FlJKS9UQyC8
https://github.com/user-attachments/assets/aa8ef2a1-2310-47e6-897a-769d85489396
ai帮你自动截图(网页截图)
指令:把huggingface的首页截个图
https://youtu.be/7ycK6iksWi4
https://github.com/user-attachments/assets/65c6eee2-6366-493d-a3bd-2b27529ff5b3
ai帮你自动截图(元素截图)
指令:把huggingface首页的图标截取下来
https://youtu.be/ev8VivANIrk
https://github.com/user-attachments/assets/d0cf9785-c2fe-4729-a3c5-7f2b8b96fe0c
ai帮你管理书签
指令:将当前页面添加到书签中,放到合适的文件夹
https://youtu.be/R_83arKmFTo
https://github.com/user-attachments/assets/15a7d04c-0196-4b40-84c2-bafb5c26dfe0
自动关闭网页
指令:关闭所有shadcn相关的网页
https://youtu.be/2wzUT6eNVg4
https://github.com/user-attachments/assets/83de4008-bb7e-494d-9b0f-98325cfea592
🤝 贡献指南
我们欢迎贡献!请查看 CONTRIBUTING_zh.md 了解详细指南。
🚧 未来发展路线图
我们对 Chrome MCP Server 的未来发展有着激动人心的计划:
-
身份认证
-
录制与回放
-
工作流自动化
-
增强浏览器支持(Firefox 扩展)
想要为这些功能中的任何一个做贡献? 查看我们的贡献指南并加入我们的开发社区!
最后编辑:Ddd4j 更新时间:2026-01-28 18:36