Chrome 调试 MCP 剧作家

使用 Playwright 实现浏览器自动化的模型上下文协议 (MCP)，并完全支持 Greasemonkey API。

特征

核心浏览器功能

浏览器启动和管理
具有创建/切换/关闭功能的多选项卡支持
页面导航和交互
屏幕截图

Greasemonkey API 支持

GM_addStyle 用于 CSS 注入
GM_getValue/GM_setValue 用于数据存储
GM_deleteValue 用于存储清理
GM_notification 用于桌面通知
GM_setClipboard 用于剪贴板操作
GM_xmlhttpRequest 用于跨域请求

资源管理

网络请求拦截
请求阻止、修改和记录
资源类型过滤

调试功能

详细日志系统
日志文件组织
清洁接口输出

安装

npm install chrome-debug-mcp-playwright

快速入门

// Launch browser
tool browser launch_browser --url "https://example.com" --browserType "chromium"

// Use GM functions
tool browser gm_setValue --key "setting" --value "test"
tool browser gm_getValue --key "setting"

// Intercept requests
tool browser intercept_requests --patterns ["*.jpg", "*.css"] --action "block"

文档

命令- 带有示例的详细命令文档
COMMANDS.md 中提供了完整的命令列表和使用示例

核心功能

浏览器管理

// Launch browser
tool browser launch_browser --url "https://example.com"

// Create new tab
tool browser create_tab --url "https://example.com"

// Switch between tabs
tool browser switch_tab --index 1

Greasemonkey API

// Add custom styles
tool browser gm_addStyle --css "body { background: #f0f0f0; }"

// Store data
tool browser gm_setValue --key "setting" --value "test"

// Make cross-origin requests
tool browser gm_xmlhttpRequest --url "https://api.example.com/data" --method "GET"

资源拦截

// Block image loading
tool browser intercept_requests --patterns ["*.jpg", "*.png"] --action "block"

// Log all CSS requests
tool browser intercept_requests --patterns ["*.css"] --action "log"

实现细节

日志系统

所有调试输出重定向到日志文件
带时间戳的条目
组织在日志目录中
清洁接口输出

错误处理

详细的错误日志记录
正确清理错误
资源管理

依赖项

剧作家：浏览器自动化
@modelcontextprotocol/sdk: MCP 实现

发展

先决条件

Node.js 16 或更高版本
npm 7 或更高版本

设置

git clone https://github.com/yourusername/chrome-debug-mcp-playwright.git
cd chrome-debug-mcp-playwright
npm install

执照

MIT 许可证 - 有关详细信息，请参阅 LICENSE 文件。

贡献

欢迎大家贡献！详情请参阅我们的贡献指南。

致谢

基于 Robert Headley 的原始chrome-debug-mcp 。

=======

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

Chrome 调试 MCP 服务器

用于控制 Chrome 的模型上下文协议 (MCP) 服务器，具有调试功能、用户脚本注入和扩展支持。

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

=======

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

特征

Chrome 控件

使用自定义配置启动 Chrome
支持自定义 Chrome 可执行文件路径
用户配置文件管理（默认或自定义用户数据目录）
扩展支持和管理
禁用 Chrome 的“自动化控制”横幅

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

=======

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

页面自动化

单击、键入并与页面元素交互
处理下拉菜单和表单输入
悬停并等待元素
截取整个页面或元素的屏幕截图
在页面之间导航
设置视口大小和设备模拟
从元素中提取文本和属性

标签管理

列出所有打开的标签页及其 ID 和 URL
使用指定的 URL 打开新标签页
按 ID 关闭标签页
在标签页之间切换
跟踪和管理多个选项卡状态

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

调试功能

通过 Chrome DevTools 协议（CDP）进行远程调试
控制台日志捕获和监控
页面上下文中的 JavaScript 评估
实时控制台输出流

用户脚本支持

将用户脚本注入网页
Greasemonkey 风格的 API 支持：
- GM_setValue / GM_getValue用于持久存储
- GM_addStyle用于 CSS 注入
- GM_xmlhttpRequest用于跨域请求
- GM_openInTab用于创建新标签页
- GM_registerMenuCommand用于菜单命令

扩展集成

加载解压的扩展
维护扩展状态和配置
支持默认 Chrome 个人资料扩展
选择性扩展启用/禁用

安装

先决条件

Node.js （v14 或更高版本）
Chrome浏览器已安装
Visual Studio 代码
Roo 代码扩展

安装 Roo 代码扩展

打开 Visual Studio Code
转到扩展（Ctrl+Shift+X）
搜索“Roo 代码”
单击“安装”

设置 Chrome 调试 MCP 服务器

克隆此存储库：
git clone https://github.com/yourusername/chrome-debug-mcp.git cd chrome-debug-mcp
安装依赖项：
npm install
构建项目：
npm run build
在 Roo 代码中配置：添加到cline_mcp_settings.json ：
{ "mcpServers": { "chrome-debug": { "command": "node", "args": ["path/to/chrome-debug-mcp/build/index.js"], "disabled": false, "alwaysAllow": [] } } }

用法

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

有关所有可用命令、工具和功能的完整参考，请参阅COMMANDS.md 。

64acbb3 的父级（通过上传添加文件）======= 有关所有可用命令、工具和功能的完整参考，请参阅COMMANDS.md 。

64acbb3 的父级（通过上传添加文件）

Chrome 基本启动

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "launch_chrome",
  arguments: {
    executablePath: "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe",
    url: "https://example.com"
  }
})

使用自定义配置文件启动

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "launch_chrome",
  arguments: {
    executablePath: "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe",
    userDataDir: "path/to/chrome/profile",
    disableAutomationControlled: true
  }
})

注入用户脚本

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "launch_chrome",
  arguments: {
    url: "https://example.com",
    userscriptPath: "path/to/userscript.js"
  }
})

评估 JavaScript

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "evaluate",
  arguments: {
    expression: "document.title"
  }
})

获取控制台日志

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "get_console_logs",
  arguments: {
    clear: true
  }
})

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

=======

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

页面交互示例

单击元素

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "click",
  arguments: {
    selector: "#submit-button",
    delay: 500
  }
})

在输入框中输入

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "type",
  arguments: {
    selector: "#search-input",
    text: "search query",
    delay: 100
  }
})

从下拉列表中选择

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "select",
  arguments: {
    selector: "#country-select",
    value: "US"
  }
})

等待元素

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "wait_for_selector",
  arguments: {
    selector: ".loading-complete",
    visible: true,
    timeout: 5000
  }
})

截屏

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "screenshot",
  arguments: {
    path: "screenshot.png",
    fullPage: true
  }
})

设置视口大小

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "set_viewport",
  arguments: {
    width: 1920,
    height: 1080,
    deviceScaleFactor: 1
  }
})

标签管理示例

列出所有标签

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "list_tabs",
  arguments: {}
})

打开新标签页

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "new_tab",
  arguments: {
    url: "https://example.com"
  }
})

切换到标签页

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "switch_tab",
  arguments: {
    tabId: "tab-id-from-list-tabs"
  }
})

关闭标签页

use_mcp_tool({
  server_name: "chrome-debug",
  tool_name: "close_tab",
  arguments: {
    tabId: "tab-id-from-list-tabs"
  }
})

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

64acbb3 的父级（通过上传添加文件） ======= 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件） ======== 64acbb3 的父级（通过上传添加文件）

依赖项

该项目使用以下开源包：

Puppeteer - Chrome 自动化库
chrome-remote-interface - Chrome DevTools 协议客户端
@modelcontextprotocol/sdk - 用于服务器实现的 MCP SDK

执照

该项目根据 MIT 许可证获得许可 - 有关详细信息，请参阅 LICENSE 文件。

贡献

有关贡献的详细信息，请参阅我们的贡献指南。

致谢

Chrome DevTools 协议
Greasemonkey API <<<<<<< HEAD <<<<<<< HEAD <<<<<<<< HEAD <<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD
模型上下文协议

8a57443 的父级（来自 robertheadley/feature/puppeteer-commands 的合并请求 #4）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）=======

模型上下文协议

64acbb3 的父级（通过上传添加文件）

Integrations

Chrome 调试 MCP 剧作家

特征

核心浏览器功能

Greasemonkey API 支持

资源管理

调试功能

安装

快速入门

文档

核心功能

浏览器管理

Greasemonkey API

资源拦截

实现细节

日志系统

错误处理

依赖项

发展

先决条件

设置

执照

贡献

致谢

基于 Robert Headley 的原始chrome-debug-mcp 。

Chrome 调试 MCP 服务器

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

特征

Chrome 控件

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

页面自动化

标签管理

调试功能

用户脚本支持

扩展集成

安装

先决条件

安装 Roo 代码扩展

设置 Chrome 调试 MCP 服务器

用法

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

Chrome 基本启动

使用自定义配置文件启动

注入用户脚本

评估 JavaScript

获取控制台日志

<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<<< 头部 <<<<<<<< 头部 <<<<<<<< 头部

页面交互示例

单击元素

在输入框中输入

从下拉列表中选择

等待元素

截屏

设置视口大小

标签管理示例

列出所有标签

打开新标签页

切换到标签页

关闭标签页

依赖项

执照

贡献

致谢

Tools

Related Resources

Appeared in Searches