能力标签
mcp-chrome MCP工具
🔌
MCP工具

mcp-chrome MCP工具

基于 TypeScript · 让 AI 助手直接操作你的系统与工具
英文名:mcp-chrome
⭐ 11.6k Stars 🍴 1.0k Forks 💻 TypeScript 📄 MIT 🏷 AI 8.5分
8.5AI 综合评分
Chrome扩展模型上下文协议浏览器自动化AI集成
✦ AI Skill Hub 推荐

经 AI Skill Hub 精选评估,mcp-chrome MCP工具 获评「强烈推荐」。在 GitHub 上收获超过 11.6k 颗 Star,这款MCP工具在功能完整性、社区活跃度和易用性方面表现出色,AI 评分 8.5 分,适合有一定技术背景的用户使用。

📚 深度解析

mcp-chrome MCP工具 是一款基于 MCP(Model Context Protocol)标准协议的 AI 工具扩展。MCP 协议由 Anthropic 开发并开源,旨在建立 AI 模型与外部工具之间的标准化通信接口,目前已被 Claude Desktop、Claude Code、Cursor 等主流 AI 工具采纳。

通过安装 mcp-chrome MCP工具,你的 AI 助手将获得额外的工具调用能力,可以用自然语言直接操控该工具的功能,无需学习复杂的命令行语法。MCP 工具的核心价值在于"一次配置,永久增强"——配置完成后,每次与 AI 对话时都可以无缝调用这些工具。

在技术实现上,MCP 工具通过标准的 JSON-RPC 协议与 AI 客户端通信,工具的功能以"工具列表"的形式暴露给 AI 模型,AI 可以按需调用。mcp-chrome MCP工具 提供了结构化的工具调用接口,使 AI 模型能够精确地理解和使用每个功能点,显著降低 AI 在工具使用上的错误率。

与传统的 API 集成相比,MCP 工具的优势在于无需编写代码——用户只需在配置文件中添加几行 JSON,即可让 AI 获得全新能力。AI Skill Hub 将 mcp-chrome MCP工具 评为 AI 评分 8.5 分,属于同类工具中的优质选择。

📋 工具概览

基于Chrome扩展的模型上下文协议服务器。通过浏览器扩展实现MCP标准,支持AI模型与Chrome交互,适合需要浏览器自动化、网页数据抓取、内容处理的开发者和AI应用构建者。

mcp-chrome MCP工具 是一款遵循 MCP(Model Context Protocol)标准协议的 AI 工具扩展。通过 MCP 协议,它可以让 Claude、Cursor 等主流 AI 客户端直接访问和操作外部工具、数据源和服务,实现 AI 能力的无缝扩展。无论是文件操作、数据库查询还是 API 调用,都可以通过自然语言在 AI 对话中直接触发,极大提升生产效率。

GitHub Stars
⭐ 11.6k
开发语言
TypeScript
支持平台
Windows / macOS / Linux
维护状态
活跃维护,更新频繁
开源协议
MIT
AI 综合评分
8.5 分
工具类型
MCP工具
Forks
1.0k

📖 中文文档

以下内容由 AI Skill Hub 根据项目信息自动整理,如需查看完整原始文档请访问底部「原始来源」。

基于Chrome扩展的模型上下文协议服务器。通过浏览器扩展实现MCP标准,支持AI模型与Chrome交互,适合需要浏览器自动化、网页数据抓取、内容处理的开发者和AI应用构建者。

mcp-chrome MCP工具 是一款遵循 MCP(Model Context Protocol)标准协议的 AI 工具扩展。通过 MCP 协议,它可以让 Claude、Cursor 等主流 AI 客户端直接访问和操作外部工具、数据源和服务,实现 AI 能力的无缝扩展。无论是文件操作、数据库查询还是 API 调用,都可以通过自然语言在 AI 对话中直接触发,极大提升生产效率。

📌 核心特色
  • 通过标准 MCP 协议与 Claude、Cursor 等主流 AI 客户端深度集成
  • 提供结构化工具调用接口,显著降低 AI 集成复杂度
  • 支持 Claude Desktop 和 Claude Code 无缝接入,开箱即用
  • 可与其他 MCP 工具组合叠加,构建完整 AI 工作站
  • 轻量无侵入设计,不影响现有系统架构
🎯 主要使用场景
  • 在 Claude Desktop 对话中直接调用本地工具,实现 AI 与系统的深度联动
  • 通过自然语言驱动复杂的多步骤自动化任务,代替繁琐手动操作
  • 将多个 MCP 工具组合使用,构建个人专属 AI 工作站
以下安装命令基于项目开发语言和类型自动生成,实际以官方 README 为准。
安装命令
# 方式一:通过 Claude Code CLI 一键安装
claude skill install https://github.com/hangwin/mcp-chrome

# 方式二:手动配置 claude_desktop_config.json
{
  "mcpServers": {
    "mcp-chrome-mcp--": {
      "command": "npx",
      "args": ["-y", "mcp-chrome"]
    }
  }
}

# 配置文件位置
# macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
# Windows: %APPDATA%/Claude/claude_desktop_config.json
📋 安装步骤说明
  1. 确认已安装 Node.js(v18 或以上版本)
  2. 打开 Claude Desktop 或 Claude Code 的 MCP 配置文件
  3. 按「交给 Agent 安装 → Claude Desktop」标签中的 JSON 配置填入 mcpServers 字段
  4. 保存配置文件并重启 Claude 客户端
  5. 重启后,在对话中即可使用本工具
以下用法示例由 AI Skill Hub 整理,涵盖最常见的使用场景。
常用命令 / 代码示例
# 安装后在 Claude 对话中直接使用
# 示例:
用户: 请帮我用 mcp-chrome MCP工具 执行以下任务...
Claude: [自动调用 mcp-chrome MCP工具 MCP 工具处理请求]

# 查看可用工具列表
# 在 Claude 中输入:"列出所有可用的 MCP 工具"
以下配置示例基于典型使用场景生成,具体参数请参照官方文档调整。
配置示例
// claude_desktop_config.json 配置示例
{
  "mcpServers": {
    "mcp-chrome_mcp__": {
      "command": "npx",
      "args": ["-y", "mcp-chrome"],
      "env": {
        // "API_KEY": "your-api-key-here"
      }
    }
  }
}

// 保存后重启 Claude Desktop 生效
📑 README 深度解析 真实文档 完整度 60/100 查看 GitHub 原文 →
以下内容由系统直接从 GitHub README 解析整理,保留代码块、表格与列表结构。

Chrome MCP Server 🚀

Stars License: MIT TypeScript Chrome Extension Release

🌟 Turn your Chrome browser into your intelligent assistant - Let AI take control of your browser, transforming it into a powerful AI-controlled automation tool.

📖 Documentation: English | 中文

The project is still in its early stages and is under intensive development. More features, stability improvements, and other enhancements will follow.

---

✨ New Features(2025/12/30)

  • A New Visual Editor for Claude Code & Codex, for more detail here: VisualEditor

✨ Core Features

  • 😁 Chatbot/Model Agnostic: Let any LLM or chatbot client or agent you prefer automate your browser
  • ⭐️ Use Your Original Browser: Seamlessly integrate with your existing browser environment (your configurations, login states, etc.)
  • 💻 Fully Local: Pure local MCP server ensuring user privacy
  • 🚄 Streamable HTTP: Streamable HTTP connection method
  • 🏎 Cross-Tab: Cross-tab context
  • 🧠 Semantic Search: Built-in vector database for intelligent browser tab content discovery
  • 🔍 Smart Content Analysis: AI-powered text extraction and similarity matching
  • 🌐 20+ Tools: Support for screenshots, network monitoring, interactive operations, bookmark management, browsing history, and 20+ other tools
  • 🚀 SIMD-Accelerated AI: Custom WebAssembly SIMD optimization for 4-8x faster vector operations

Prerequisites

  • Node.js >= 20.0.0 and pnpm/npm
  • Chrome/Chromium browser

Installation Steps

  1. Download the latest Chrome extension from GitHub

Download link: https://github.com/hangwin/mcp-chrome/releases

  1. Install mcp-chrome-bridge globally

npm

npm install -g mcp-chrome-bridge

pnpm

```bash

Method 2: Manual registration (if postinstall doesn't run)

pnpm install -g mcp-chrome-bridge mcp-chrome-bridge register ```

Note: pnpm v7+ disables postinstall scripts by default for security. The enable-pre-post-scripts setting controls whether pre/post install scripts run. If automatic registration fails, use the manual registration command above.

3. Load Chrome Extension - Open Chrome and go to chrome://extensions/ - Enable "Developer mode" - Click "Load unpacked" and select your/dowloaded/extension/folder - Click the extension icon to open the plugin, then click connect to see the MCP configuration <img width="475" alt="Screenshot 2025-06-09 15 52 06" src="https://github.com/user-attachments/assets/241e57b8-c55f-41a4-9188-0367293dc5bc" />

🚀 Quick Start

Usage with MCP Protocol Clients

Using Streamable HTTP Connection (👍🏻 Recommended)

Add the following configuration to your MCP client configuration (using CherryStudio as an example):

Streamable HTTP connection method is recommended
{
  "mcpServers": {
    "chrome-mcp-server": {
      "type": "streamableHttp",
      "url": "http://127.0.0.1:12306/mcp"
    }
  }
}

Using STDIO Connection (Alternative)

If your client only supports stdio connection method, please use the following approach:

  1. First, check the installation location of the npm package you just installed

```sh

🧪 Usage Examples

AI automatically takes screenshots for you (web page screenshots)

query: Take a screenshot of Hugging Face's homepage https://youtu.be/7ycK6iksWi4

https://github.com/user-attachments/assets/65c6eee2-6366-493d-a3bd-2b27529ff5b3

AI automatically takes screenshots for you (element screenshots)

query: Capture the icon from Hugging Face's homepage https://youtu.be/ev8VivANIrk

https://github.com/user-attachments/assets/d0cf9785-c2fe-4729-a3c5-7f2b8b96fe0c

🆚 Comparison with Similar Projects

Comparison DimensionPlaywright-based MCP ServerChrome Extension-based MCP Server
**Resource Usage**❌ Requires launching independent browser process, installing Playwright dependencies, downloading browser binaries, etc.✅ No need to launch independent browser process, directly utilizes user's already open Chrome browser
**User Session Reuse**❌ Requires re-login✅ Automatically uses existing login state
**Browser Environment**❌ Clean environment lacks user settings✅ Fully preserves user environment
**API Access**⚠️ Limited to Playwright API✅ Full access to Chrome native APIs
**Startup Speed**❌ Requires launching browser process✅ Only needs to activate extension
**Response Speed**50-200ms inter-process communication✅ Faster
🎯 aiskill88 AI 点评 A 级 2026-05-20

活跃度高的优质开源项目,11.6K Stars体现认可度。MCP+Chrome的组合创新,为AI应用扩展提供强大工具层。TypeScript实现保证代码质量,是AI智能化的重要基础设施。

📚 实用指南(长尾问题)
适合谁
  • 需要 mcp-chrome 解决具体问题的开发者与运营人员
最佳实践
  • 先在测试环境跑通最小用例,再接入生产数据
常见错误
  • API key 直接提交到 git 仓库(请用 .env 并加入 .gitignore)
部署方案
  • 云端托管:可放在 Vercel / Railway / Fly.io 等 PaaS 平台
相关搜索
mcp-chrome 中文教程mcp-chrome 安装报错怎么办mcp-chrome 与同类工具对比mcp-chrome 最佳实践mcp-chrome 适合谁用

⚡ 核心功能

👥 适合谁
  • 需要 mcp-chrome 解决具体问题的开发者与运营人员
⭐ 最佳实践
  • 先在测试环境跑通最小用例,再接入生产数据
⚠️ 常见错误
  • API key 直接提交到 git 仓库(请用 .env 并加入 .gitignore)

👥 适合人群

Claude Desktop / Claude Code 用户AI 工具开发者需要扩展 AI 能力的专业人士自动化工程师

🎯 使用场景

  • 在 Claude Desktop 对话中直接调用本地工具,实现 AI 与系统的深度联动
  • 通过自然语言驱动复杂的多步骤自动化任务,代替繁琐手动操作
  • 将多个 MCP 工具组合使用,构建个人专属 AI 工作站

⚖️ 优点与不足

✅ 优点
  • +GitHub 11.6k Star,社区高度认可
  • +MIT 协议,可免费商用
  • +标准化 MCP 协议,生态互联性强
  • +与 Claude 官方生态无缝对接
  • +即插即用,配置简单快捷
⚠️ 不足
  • 依赖 Claude 客户端,非 Claude 用户无法使用
  • MCP 协议仍在持续演进,接口可能变更
  • 需要一定的配置步骤
⚠️ 使用须知

AI Skill Hub 为第三方内容聚合平台,本页面信息基于公开数据整理,不对工具功能和质量作任何法律背书。

建议在沙箱或测试环境中充分验证后,再部署至生产环境,并做好必要的安全评估。

📄 License 说明

✅ MIT 协议 — 最宽松的开源协议之一,可自由商用、修改、分发,仅需保留版权声明。

🔗 相关工具推荐

📚 相关教程推荐
📰 相关 AI 新闻
🍿 AI 圈相关吃瓜
🗺️ 相关解决方案
🧩 你可能还需要
基于当前 Skill 的能力图谱,自动补全的工具组合

❓ 常见问题 FAQ

作为中间层连接AI模型和Chrome浏览器,使LLM能够操纵网页、提取信息、执行自动化任务。
💡 AI Skill Hub 点评

AI Skill Hub 点评:mcp-chrome MCP工具 的核心功能完整,质量优秀。对于Claude Desktop / Claude Code 用户来说,这是一个值得纳入个人工具库的选择。建议先在非生产环境试用,再逐步推广。

⬇️ 获取与下载
⬇ 下载源码 ZIP

✅ MIT 协议 · 可免费商用 · 直接从 aiskill88 服务器下载,无需跳转 GitHub

📚 深入学习 mcp-chrome MCP工具
查看分步骤安装教程和完整使用指南,快速上手这款工具
🌐 原始信息
原始名称 mcp-chrome
原始描述 开源MCP工具:Chrome MCP Server is a Chrome extension-based Model Context Protocol (MCP) serve。⭐11.6k · TypeScript
Topics Chrome扩展模型上下文协议浏览器自动化AI集成
GitHub https://github.com/hangwin/mcp-chrome
License MIT
语言 TypeScript
🔗 原始来源
🐙 GitHub 仓库  https://github.com/hangwin/mcp-chrome

收录时间:2026-05-14 · 更新时间:2026-05-16 · License:MIT · AI Skill Hub 不对第三方内容的准确性作法律背书。

📺 订阅 AI Skill Hub Daily Telegram 频道
每天 8 条精选 AI Skill、MCP、Agent 与自动化工具推送
加入频道 →