AI导哈

浏览器自动化工具

Arc MCP是一个基于Playwright风格的语义化浏览器自动化工具，提供Node.js REPL和语义定位器，适用于航班搜索、购物、杂货和研究等多种场景。

  • by andrewgazelka
  • TypeScript
  • 本地部署
  • 1 星标
  • 更新于
在 GitHub 查看 andrewgazelka/arc-mcp

使用说明

Arc的剧作家风格语义浏览器自动化

安装

克劳德桌面版

  1. 下载最新 .mcpb 文件来自 发布
  2. 打开克劳德桌面
  3. 首选 设置→ 扩展
  4. 拖放 这 .mcpb 文件放到窗口上

克劳德代码

claude mcp add --scope user --transport stdio arc nix run github:andrewgazelka/arc-mcp

或者手动添加到MCP设置中：

{
  "mcpServers": {
    "arc": {
      "command": "nix",
      "args": ["run", "github:andrewgazelka/arc-mcp"]
    }
  }
}

用例

航班搜索 --比较各航空公司的价格，查看空房情况，预订机票

购物 --搜索产品、阅读评论、添加购物车、结账

食品杂货 --浏览商店目录、构建购物车、安排配送

研究 --打开多个来源，提取数据，综合信息

特性

Node.js REPL

在完全访问浏览器API的情况下执行自动化脚本-无预定义的工具约束。

await browser.click({ role: { role: 'button', name: 'Search' } });
await browser.fill({ label: 'Email' }, 'user@example.com');
const tabs = await browser.listTabs();
return tabs.length;

语义定位器

按照用户看到的方式查找元素——按角色、标签、文本或占位符。不再有脆弱的CSS选择器。

await browser.click({ role: { role: 'button', name: 'Search' } });
await browser.fill({ label: 'Email' }, 'user@example.com');
await browser.type({ placeholder: 'Search...' }, 'London');

智能DOM树

获取仅包含交互元素的页面的结构化语义表示。

const structure = await browser.getPageStructure(10);

可用功能

这 browser 对象提供：

语义动作:

  • click(locator, options?) --按角色、标签、文本、占位符或CSS单击元素
  • fill(locator, value, options?) --快速填充（替换整个值）
  • type(locator, text, options?) --逐个字符键入（触发自动补全）
  • selectOption(locator, option, options?) --选择下拉选项

导航:

  • openUrl(url, newTab?) --在新选项卡或当前选项卡中打开URL
  • getCurrentTab() --获取活动选项卡信息（标题、URL）
  • listTabs() --列出所有打开的选项卡
  • switchToTab(tabId) --按索引切换到选项卡
  • closeTab(tabId) --按索引关闭选项卡
  • reloadTab(tabId?) --重新加载选项卡
  • goBack(tabId?) --返回导航
  • goForward(tabId?) --向前导航

页面分析:

  • getPageStructure(maxDepth?, tabId?) --获取语义DOM树

低的:

  • executeJavaScript(code, tabId?) --运行任意JavaScript

工作流示例

// Open Google Flights
await browser.openUrl('https://www.google.com/travel/flights');

// Fill origin
await browser.fill({ label: 'Where from?' }, 'San Francisco');

// Type destination (triggers autocomplete)
await browser.type({ placeholder: 'Where to?' }, 'London');

// Click search
await browser.click({ role: { role: 'button', name: 'Search' } });

建筑

这是一个包含三个包的monorepo：

  • @arc mcp/applescript --Arc的低级AppleScript桥
  • @arc mcp/浏览器 -带有语义定位器的高级Node.js API
  • arc-mcp服务器 --MCP服务器暴露REPL

看 建筑.md 详细设计。

需求

  • macOS
  • Arc浏览器

发展

npm install
npm run build        # Build all packages
npm run typecheck    # Type check all packages
npm run pack         # Create .mcpb bundle

包装使用

每个包都可以独立使用：

# Use browser API in your own scripts
npm install @arc-mcp/browser

# Use AppleScript bridge directly
npm install @arc-mcp/applescript

不隶属于浏览器公司。Arc是浏览器公司的商标。

麻省理工学院 · 安德鲁·加泽尔卡

相关 MCP