AgentHubAgentHub

使用场景/浏览器自动化

浏览器自动化 MCP 推荐

让 AI 控制真实浏览器:打开页面、点击、填表、截图。适合 E2E 测试、竞品巡检、无 API 的网页操作。

共匹配 1,001 个资源 · 第 18 / 21 页

什么是浏览器自动化?

浏览器自动化 MCP Server 让 AI 直接操作一个真实的浏览器:打开页面、点击按钮、填写表单、截图取证、抓取渲染后的内容。它与网页抓取的区别在于「先渲染、后读取」——JavaScript 动态加载的内容、需要登录与交互的页面都能处理,适合没有开放 API 的网站。

首选推荐 Playwright MCP:它以无障碍树(accessibility tree)而非像素坐标定位元素,AI 理解页面更稳定、更少误点;由微软官方维护,Cursor、Claude Code、VS Code 等主流客户端均支持一键配置。Puppeteer 类服务轻量一些,适合简单的截图与导航任务。

安全提醒:浏览器自动化等价于把浏览器操作权限交给 AI。建议在独立浏览器 Profile 或沙箱中运行,不要登录含支付、企业权限的账号,并对「提交、删除、支付」类操作保留人工确认。

适合做什么

  • E2E 自动化测试
  • 无头浏览器截图
  • 表单批量填写
  • 页面回归巡检

不太适合

  • 已有稳定 REST API 的批量抓取(优先 HTTP 客户端)
  • 需要绕过复杂验证码(合规风险)
常见组合: Playwright MCP + Filesystem MCP → AI 写测试脚本并执行浏览器操作

相关资源

查看全部 →

ccxt-typescript(CCXT TypeScript 指南)

SkillSkillsMP

面向 TypeScript 与 JavaScript 开发者(Node.js 与浏览器)的 CCXT 加密货币交易所库。同时覆盖 REST API(标准)与 WebSocket API(实时)。帮助安装 CCXT、连接交易所、获取行情、下单、流式接收 ticker/订单簿、处理鉴权与管理错误。适用于在 TypeScript/JavaScript 项目中对接加密货币交易所、交易机器人、套利系统或投资组合管理工具。包含 REST 与 WebSocket 示例。

source

开发 Standalone 浏览器版

SkillSkillsMP

开发 Trilium 的浏览器内 standalone 构建(apps/standalone,部署于 app.triliumnotes.org 并被移动应用内嵌)时使用:service worker(sw.ts)、leader 标签页选举与多标签请求转发、SQLite worker(local-server-worker.ts、基于 OPFS SAHPool 的 @sqlite.org/sqlite-wasm)、initializeCore() 所需的 lightweight/* 提供者实现、standalone 专用路由、window.standaloneApi、OPFS 中的备份/恢复、Vite 打包桩(officeparser、pdfjs、sqlite wasm 副本)、启动错误,以及运行/测试/部署。当 packages/trilium-core 的变更新增 provider、Node import 或顶层副作用时也需加载——standalone 是最容易出问题的地方。

source

Cache Components 秒开优化(Next.js)

SkillSkillsMP

在 Cache Components / PPR 下,为把 Next.js 路由做到即时导航设定 agent 循环,覆盖首次加载(hard navigation)与客户端导航(soft navigation)。把目标编码为一个失败的 @next/playwright instant() e2e 并逐路由跑绿;固化的测试随后可防回归。当需要让某路由导航即时(static shell 立即 commit)、修复 static shell 未被预渲染/服务/预取的路由、扩大 static shell 或修复首屏缓慢、诊断是哪个 Suspense boundary 让路由无法进入 static shell,或为某个路由编写 instant() e2e 守卫时使用。需要 Next.js 16.3+ 且启用 cacheComponents;版本过旧则先升级。

source

CopilotKit React 核心

SkillSkillsMP

@copilotkit/react-core——在 Next.js App Router / React Router v7 / TanStack Start / SPA 应用中挂载 CopilotKit provider(来自 @copilotkit/react-core/v2),接入 CopilotChat/CopilotPopup/CopilotSidebar(v2 聊天组件由 react-core/v2 提供,而非仅有 CSS 的 react-ui),通过 useAgent/useAgentContext/useCapabilities 访问和订阅 agent,在多个 agent 间切换,用 useThreads 管理持久的 Intelligence 会话线程,通过 useFrontendTool 注册浏览器端工具,用 useRenderTool/useComponent/useDefaultRenderTool 渲染工具调用,用 useHumanInTheLoop 做执行门控,用 useAttachments 接入文件附件,配置建议词,以及注册活动与自定义消息渲染器。publicLicenseKey 为正式字段(publicApiKey 是已废弃别名)。按任务加载 references/ 下对应的参考文件。

source

安全修改 TaxonomicFilter

SkillSkillsMP

指导安全修改 TaxonomicFilter——PostHog 用于事件、action、属性、群组等的多标签选择器。先讲清经验性的产品现实(用户实际挑选和搜索什么)以及三个在用变体(legacy-control、藏在 TAXONOMIC_FILTER_CATEGORY_DROPDOWN 开关后的 legacy-pill、藏在 TAXONOMIC_FILTER_MENU_REBUILD 后的自选重构菜单),让改动以真实行为为评判标准并在多个界面镜像同步,而不是孤立地针对一支实现。在新增功能、修 bug 或重构 TaxonomicFilter、重构菜单或无头筛选面板时使用。

source

编码 Agent 会话 coding-agent-sessions

SkillSkillsMP

当需要查找、读取、列出、搜索、查看、拉取、导出或重建跨 Codex、Claude Code/Desktop、OpenCode、OMO/Senpi/pi、oh-my-pi (omp)、gajae-code (gjc)、OpenClaw、Factory Droid、Amp、Gemini/Kimi/Qwen CLI、Codebuff、Roo/Kilo/Cline、Kodu、Cursor CLI、Aider、Aside 浏览器 agent 会话或未知本地 agent 日志时务必使用。覆盖 transcript、会话 ID、rollout JSONL、state SQLite、Claude projects/pre-compact 历史、OpenCode messages/parts、子/subagent 关联、cwd/model/时间/token 过滤、归档与成本线索。会把模糊回忆展开为并行查询通道,并先探测已知存储,从而低成本跳过不存在的平台。触发词:coding agent sessions、Codex/Claude/OpenCode/OMO/Senpi/pi/oh-my-pi/omp/gajae-code/gjc/OpenClaw/Droid/Amp/Kodu/Cursor/Aider/Aside sessions、transcript search、session history、session ID、read transcript、token usage、subagent sessions、what did I do yesterday、did we already do this。

source

version-bump(Meteor 版本发布)

vdevel

SkillSkillsMP

在为 beta、RC 或正式版本提升 Meteor 包版本时使用。涵盖两套版本体系(meteor-tool 与其他所有包)、update-semver 自动化工具、工具无法覆盖的手动文件、modern-tool npm 包的 semver 分析、官方安装器门禁,以及从 beta 到正式发布的完整生命周期。适用于 packages/*/package.js、scripts/admin/、npm-packages/meteor-installer/、modern-tool npm 包以及测试应用中的 .meteor/versions。

source

带标注线框图 wireframe-annotated

SkillSkillsMP

带标注/红线的低保真线框图——桌面落地页/营销页以扁平灰盒画在浏览器边框内,叠加单一主色的编号标注针(①②③④⑤),并配右侧规格面板逐条列出每个编号针的简短工程/UX 说明。这是「线框 + 红线规格」风格——干净、扁平、低保真、非手绘。当需求提到「annotated wireframe」「redline wireframe」「wireframe with spec」「lo-fi landing wireframe」「low fidelity」「线框图」「标注线框」或「redline」时使用。

source

DevOps 工程师

SkillSkillsMP

编写 Dockerfile、配置 CI/CD 流水线、撰写 Kubernetes manifest,并生成 Terraform/Pulumi 基础设施模板。处理部署自动化、GitOps 配置、事故响应 runbook 与内部开发平台工具。在搭建 CI/CD 流水线、应用容器化、管理基础设施即代码、部署到 Kubernetes 集群、配置云平台、自动化发布或响应生产事故时使用。涉及流水线、Docker、Kubernetes、GitOps、Terraform、GitHub Actions、值班响应或平台工程时调用。

source

带标注线框图 wireframe-annotated

SkillSkillsMP

带标注/红线的低保真线框图——桌面落地页/营销页以扁平灰盒画在浏览器边框内,叠加单一主色的编号标注针(①②③④⑤),并配右侧规格面板逐条列出每个编号针的简短工程/UX 说明。这是「线框 + 红线规格」风格——干净、扁平、低保真、非手绘。当需求提到「annotated wireframe」「redline wireframe」「wireframe with spec」「lo-fi landing wireframe」「low fidelity」「线框图」「标注线框」或「redline」时使用。

source

orca-emulator(Orca iOS 模拟器控制)

SkillSkillsMP

在 Orca 内通过 orca CLI 控制移动端(iOS)模拟器/仿真画面流。用于点击、手势、输入、硬件按键、相机注入、权限、无障碍树等,并在 Orca 的模拟器窗格中实时查看画面。在 Orca 中运行 agent 时优先于原始 npx serve-sim 或直接 simctl(orca 层处理设备定位、helper 生命周期与工作树上下文)。与 orca-cli 技能互补(终端、工作树和内置浏览器)。

source

端到端代理测试 agent-testing

vcanary

SkillSkillsMP

面向任意项目的代理式端到端测试:经项目 CLI 验证后端、经 agent-browser 验证前端(Web)、经 CDP 验证桌面(Electron)。驱动真实界面、收集视觉确证的证据,并把结构化报告发布到 LobeHub verify 平台。触发词:'cli test'、'test with cli'、'verify with cli'、'backend test with cli'、'local test'、'test in electron'、'test desktop'、'manual test'、'test report',或任何本地端到端验证任务。

source

常见问题

浏览器自动化 MCP 需要什么客户端支持?

凡是支持 MCP 协议的 AI 开发工具都可以,包括 Cursor、Claude Code、VS Code(Copilot)、Windsurf、Trae 等。在 AgentHub 的资源详情页可一键复制对应客户端的 JSON 配置。

Playwright MCP 和 Puppeteer MCP 选哪个?

优先 Playwright MCP:基于无障碍树定位元素、跨浏览器支持更好、官方维护活跃。Puppeteer 类服务适合只需打开页面和截图的轻量任务。

会让 AI 看到我的账号数据吗?

模型只看到你让它读取的页面内容(截图或文本快照)。请在独立 Profile 中登录测试账号,不要复用主力账号,敏感站点建议配合无痕模式与网络隔离。

配套安装与配置教程

相关场景