mcpField
B
browser

browser

github.com/stellarlinkco开发2.8k199 次安装27 周前更新
代码仓库

关于 browser

通过轻量级 Chrome DevTools Protocol 工具实现浏览器自动化，无需配置 MCP 服务。提供启动 Chrome、导航、执行 JavaScript、截图和检查元素的脚本；操作均在本地运行。

主要功能

  1. 01启动 Chrome 并选择持久配置文件
  2. 02在当前或新标签页导航
  3. 03执行 JavaScript 表达式
  4. 04捕获页面截图
  5. 05选择元素并返回元数据
  6. 06返回结构化 JSON

适用场景

  1. 01自动化操作本地 Chrome
  2. 02用 JavaScript 检查页面内容
  3. 03为 Agent 捕获截图

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/stellarlinkco/myclaude --skill browser

安装后在 Claude Code 中输入/browser确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

package-lock.json
package.json
scripts/
eval.cjs
nav.cjs
pick.cjs
screenshot.cjs
start.cjs

详细介绍

浏览器自动化

用于浏览器自动化的精简 Chrome DevTools Protocol (CDP) 辅助工具，无需设置 MCP 服务。

设置

首次使用前安装依赖：

npm install --prefix ~/.claude/skills/browser/browser ws

脚本

所有脚本都连接到 localhost:9222 上的 Chrome。

start.js - 启动 Chrome
scripts/start.js              # Fresh profile
scripts/start.js --profile    # Use persistent profile (keeps cookies/auth)
nav.js - 导航
scripts/nav.js https://example.com        # Navigate current tab
scripts/nav.js https://example.com --new  # Open in new tab
eval.js - 执行 JavaScript
scripts/eval.js 'document.title'
scripts/eval.js '(() => { const x = 1; return x + 1; })()'

使用单个表达式，或使用 IIFE 执行多个语句。

screenshot.js - 截取屏幕截图
scripts/screenshot.js

返回已保存到临时目录的 PNG 文件的 { path, filename }。

pick.js - 可视化元素选择器
scripts/pick.js "Click the submit button"

返回元素元数据：标签、ID、类、文本、href、选择器、矩形区域。

工作流

  1. 启动 Chrome：对于经过身份验证的会话，使用 scripts/start.js --profile
  2. 导航：scripts/nav.js <url>
  3. 检查：scripts/eval.js 'document.querySelector(...)'
  4. 截取：scripts/screenshot.js 或 scripts/pick.js
  5. 返回收集到的数据

要点

  • 所有操作都在本地运行，凭据不会离开设备
  • 使用 --profile 标志保留 Cookie 和身份验证令牌
  • 脚本会返回结构化 JSON，供 Agent 使用

评论

支持 Markdown