Chrome MCP Server：让AI控制浏览器实现自动化操作的Chrome扩展

Chrome MCP Server 是一个基于Chrome浏览器的扩展程序。它通过Model Context Protocol（MCP）协议，让AI助手（如Claude）直接控制用户的Chrome浏览器，实现复杂的自动化操作、内容分析和语义搜索。相比传统浏览器自动化工具（如Playwright），它无需启动独立的浏览器进程，直接利用用户已打开的Chrome浏览器，保留用户登录状态、设置和习惯。它完全本地运行，保护用户隐私，支持流式HTTP连接和跨标签页上下文，提供20多种实用工具。用户需安装Chrome扩展和mcp-chrome-bridge软件包。该项目由hangwin开发，遵循MIT许可证，适合希望用AI提升浏览器效率的用户。

功能列表

• 浏览器自动化：支持AI助手控制浏览器，执行点击、输入、导航等操作。
• 语义搜索：内置向量数据库，智能搜索浏览器标签页内容。
• 内容分析：AI驱动的文本提取和相似度匹配，快速解析网页信息。
• 截图工具：支持网页截图，优化后的base64图像压缩节省资源。
• 网络监控：实时监控网络请求，分析网页加载性能。
• 交互元素检测：增强工具识别可交互元素，包括div元素。
• 控制台输出捕获：通过chrome_console工具获取浏览器控制台日志。
• 书签和历史管理：支持AI操作用户书签和浏览历史。
• 跨标签页上下文：实现多个标签页间的数据共享和操作。
• 本地运行：所有操作在本地完成，确保数据隐私。
• 流式HTTP连接：提供高效的通信方式，响应速度快。
• SIMD加速：WebAssembly优化向量运算，速度提升4-8倍。
• 脚本注入：支持动态注入JavaScript脚本，扩展功能。

使用帮助

安装流程

要使用Chrome MCP Server，用户需完成以下安装步骤。整个过程简单，但需要确保环境正确配置。

1. 检查环境要求
   • 确保安装Node.js（版本18.19.0或以上）。
   • 安装pnpm或npm作为包管理器。
   • 使用Chrome或Chromium浏览器（最新版本推荐）。
2. 安装Chrome扩展
   • 访问GitHub releases页面：https://github.com/hangwin/mcp-chrome/releases。
   • 下载最新版本的Chrome扩展（.crx文件）。
   • 打开Chrome浏览器，进入chrome://extensions/。
   • 启用“开发者模式”（右上角开关）。
   • 拖放下载的.crx文件到扩展页面，点击“添加扩展”完成安装。
3. 安装mcp-chrome-bridge
   • 打开终端，运行以下命令全局安装mcp-chrome-bridge：

     npm install -g mcp-chrome-bridge
     

     或使用pnpm：

     pnpm install -g mcp-chrome-bridge
     

   • 如果使用pnpm v7+，默认禁用postinstall脚本，需启用脚本：

     pnpm config set enable-pre-post-scripts true
     

   • 如果自动注册失败，手动注册：

     mcp-chrome-bridge register
     

4. 配置MCP客户端
   • 以CherryStudio为例，修改MCP客户端配置文件，添加以下内容：

     {
     "mcpServers": {
     "chrome-mcp-server": {
     "type": "streamableHttp",
     "url": "http://127.0.0.1:12306/mcp"
     }
     }
     }
     

   • 如果客户端仅支持stdio连接，需检查mcp-chrome-bridge安装路径，并配置stdio连接方式（参考官方文档CONTRIBUTING.md）。
5. 启动服务
   • 安装完成后，Chrome扩展会自动激活。
   • 运行mcp-chrome-bridge，确保服务监听在http://127.0.0.1:12306/mcp。
   • AI助手（如Claude）即可通过MCP协议连接浏览器。

主要功能操作

以下是Chrome MCP Server的几个特色功能及详细操作流程。

浏览器自动化

• 功能描述：AI助手可通过MCP协议控制浏览器，执行点击、输入、导航等操作。例如，自动填写表单或批量打开网页。
• 操作步骤：
  1. 确保MCP服务已启动，AI助手已连接。
  2. 在AI助手界面输入指令，如“打开Google并搜索关键词‘AI’”。
  3. Chrome浏览器会自动执行操作，AI会解析网页内容并返回结果。
  4. 可通过指令指定复杂任务，如“在电商网站搜索产品并添加到购物车”。

语义搜索

• 功能描述：利用内置向量数据库，AI可智能搜索浏览器标签页内容，快速定位相关信息。
• 操作步骤：
  1. 打开多个标签页，包含需要搜索的内容。
  2. 在AI助手输入指令，如“查找所有提到‘AI技术’的标签页”。
  3. AI会分析标签页内容，返回匹配结果，包括标题和摘要。
  4. 可进一步指令AI提取具体段落或跳转到相关标签页。

内容分析

• 功能描述：AI可提取网页文本，进行相似度匹配或总结。例如，分析新闻文章的关键点。
• 操作步骤：
  1. 打开目标网页，如一篇新闻文章。
  2. 在AI助手输入指令，如“总结当前网页的主要内容”。
  3. AI会提取文本，生成简洁总结或关键词列表。
  4. 可要求AI比较多篇网页内容，找出共同点或差异。

截图工具

• 功能描述：支持网页截图，优化后的base64图像压缩减少资源占用。
• 操作步骤：
  1. 打开需要截图的网页。
  2. 在AI助手输入指令，如“截取当前网页全屏图像”。
  3. AI会生成截图并返回base64编码图像。
  4. 可保存图像或要求AI分析图像内容（如提取文字）。

网络监控

• 功能描述：实时监控网页的网络请求，分析加载性能或排查问题。
• 操作步骤：
  1. 打开目标网页。
  2. 在AI助手输入指令，如“监控当前网页的网络请求”。
  3. AI会返回请求列表，包括URL、状态码和响应时间。
  4. 可进一步分析慢加载资源或异常请求。

注意事项

• 确保Chrome扩展和mcp-chrome-bridge版本一致，避免兼容性问题。
• 本地运行可能占用一定内存，建议关闭不必要的标签页。
• 查看GitHub的CONTRIBUTING.md获取更多配置细节或贡献代码。

应用场景

1. 自动化办公
   员工可使用AI助手批量处理网页任务，如自动填写报表、提取数据或监控网站更新。Chrome MCP Server利用现有浏览器环境，无需重新登录，节省时间。
2. 内容研究
   研究人员可通过语义搜索和内容分析功能，快速整理多个网页的信息。例如，分析行业报告或学术文章，提取关键点并生成总结。
3. 网站开发与测试
   开发者可利用网络监控和控制台输出捕获功能，调试网页性能或自动化测试交互流程。脚本注入工具支持动态修改网页，方便原型开发。
4. 个人效率提升
   用户可让AI管理书签、浏览历史或执行重复性操作，如定时检查邮箱或批量下载文件，提升日常效率。

QA

1. Chrome MCP Server是否需要联网？
   它完全本地运行，AI助手与浏览器的通信在本地完成，无需联网。但AI助手本身可能需要联网，具体取决于使用的AI模型。
2. 支持哪些AI助手？
   目前支持Claude等兼容MCP协议的AI助手。未来可能扩展更多模型，具体查看GitHub更新。
3. 如何确保隐私安全？
   所有操作在本地执行，数据不上传云端。建议从官方GitHub下载扩展，避免第三方来源。
4. 安装失败怎么办？
   检查Node.js和pnpm版本是否符合要求，确保Chrome开发者模式已开启。参考CONTRIBUTING.md或提交Issue求助。