Agent之skill：agent-browser的简介、安装和使用方法、案例应用之详细攻略

目录

agent-browser的简介

1、特点

agent-browser的安装和使用方法

1、安装

2、使用方法

agent-browser的案例应用

案例一：基于 Snapshot 的页面交互——使用页面快照完成元素点击与输入

案例二：获取页面信息—提取页面标题与地址

案例三：命令链自动执行浏览流程— 打开页面后等待加载并生成页面快照

agent-browser的简介

Agent Browser 是一个由 Vercel Labs 提供的浏览器自动化CLI 工具，定位于面向AI Agent 的浏览器控制能力。项目采用原生 Rust CLI 实现，提供统一的命令行接口，可完成浏览器启动、页面导航、元素定位、页面交互、页面信息获取、截图、状态检查等一系列浏览器自动化操作。项目通过后台守护进程保持浏览器会话持续运行，使多个命令之间能够共享同一个浏览器实例，提高连续操作效率。

项目围绕 AI Agent 的浏览体验进行了专门设计，支持 Snapshot（页面快照）、元素引用（Refs）、语义定位（Semantic Locators）以及 JSON 输出等能力，使 AI Agent 可以先获取页面结构，再依据元素引用完成点击、输入、读取等操作，从而减少重复定位元素的成本，提高自动化操作的稳定性。同时，项目还提供 Skills 功能，为 AI Agent 提供与当前 CLI 版本保持一致的操作说明。

此外，项目支持本地浏览器以及多种远程浏览器 Provider，并提供安装诊断（doctor）、浏览器安装、升级、初始化脚本、自定义浏览器参数、扩展加载等功能，使浏览器自动化能够适用于本地开发、CI/CD 以及云端运行等不同场景。

Github地址：GitHub - vercel-labs/agent-browser: Browser automation CLI for AI agents · GitHub

1、特点

agent-browser的安装和使用方法

1、安装

全局安装（推荐）

npm install -g agent-browser agent-browser install

首次执行 agent-browser install 时，会下载 Chrome for Testing 浏览器。

项目本地安装

npm install agent-browser agent-browser install Homebrew（macOS） brew install agent-browser agent-browser install Cargo（Rust） cargo install agent-browser agent-browser install

从源码构建

git clone https://github.com/vercel-labs/agent-browser cd agent-browser pnpm install pnpm build pnpm build:native pnpm link --global agent-browser install

源码构建需要 Node.js 24+、pnpm 11+ 以及 Rust。

2、使用方法

项目 README 推荐的基本工作流程如下：

（1）打开网页

agent-browser open Example Domain

（2）获取页面快照

agent-browser snapshot -i

页面会返回交互元素及对应引用（如 @e1、@e2）。

（3）根据引用进行交互

agent-browser click @e2 agent-browser fill @e3 "test@example.com"

（4）读取页面信息

agent-browser get title agent-browser get url agent-browser get text @e1

（5）使用语义定位

agent-browser find role button click --name "Submit" agent-browser find label "Email" fill "test@test.com"

（6）命令链执行

agent-browser open example.com && \ agent-browser wait --load networkidle && \ agent-browser snapshot -i

项目支持多个命令通过 && 串联执行，以充分利用后台浏览器会话。

agent-browser的案例应用

案例一：基于 Snapshot 的页面交互——使用页面快照完成元素点击与输入

首先打开目标页面并获取交互式 Snapshot：

agent-browser open example.com agent-browser snapshot -i

根据返回的元素引用完成页面操作：

agent-browser click @e2 agent-browser fill @e3 "test@example.com" agent-browser get text @e1

该流程利用 Snapshot 返回的元素引。用完成浏览器交互，避免重复查询页面元素。

案例二：获取页面信息—提取页面标题与地址

案例实现内容：

项目提供多个获取页面信息的命令，例如：

agent-browser get title agent-browser get url agent-browser get html body agent-browser get text h1

可用于读取页面标题、当前地址、HTML 内容及指定元素文本。

案例三：命令链自动执行浏览流程—打开页面后等待加载并生成页面快照

利用命令链一次性完成浏览流程：

agent-browser open example.com && \ agent-browser wait --load networkidle && \ agent-browser snapshot -i

该方式依赖后台守护进程保持浏览器会话，实现页面打开、等待网络空闲及生成 Snapshot 的连续执行，提高自动化操作效率。