Stagehand：借助 AI 构建的浏览器自动化框架

摘要：浏览器自动化技术被广泛地应用中在数据抓取、网页测试、自动化机器人等领域中。同时，随着网络数据的不断复杂化，浏览器自动化技术也面临着越来越多的难题，开发门槛不断变高。

浏览器自动化技术被广泛地应用中在数据抓取、网页测试、自动化机器人等领域中。同时，随着网络数据的不断复杂化，浏览器自动化技术也面临着越来越多的难题，开发门槛不断变高。

而 AI 大模型技术的出现，为这一领域带来了全新的可能。Stagehand，这一浏览器自动化框架，就提供了一个很好的新思路。

Stagehand 是一个借助 AI 构建的浏览器自动化框架，代码仓库位于 https://github.com/browserbase/stagehand 。Stagehand 号称是构建浏览器自动化的最简单方式，它与 Playwright 完全兼容，在基础的 Playwright Page 类之上提供了三个简单的 AI API（act、extract 和 observe），这些 API 能够通过自然语言来实现网页自动化。

Stagehand 的目标是提供一个轻量级、模型无关的框架，并使得开发者能够编写可靠且可重复执行的网页自动化工作流，例如自动化网页操作、数据抓取、网页测试等，而且利用 AI 大模型技术，省去了传统框架中需要了解的诸多底层技术细节，大大降低了开发门槛。

每个 Stagehand 函数都会接收一条原子指令，例如 act("点击登录按钮") 或 extract("查找泰式炒河粉的价格")，然后生成相应的 Playwright 代码来完成该指令并执行。

Stagehand 是一个 Javascript 库，安装前要求环境有 Node.js 和 NPM。首先，通过 npx 创建一个新项目，：

npx create-browser-app

这会创建一个空项目，也可以参照入门例子创建项目：

npx create-browser-app --example quickstart

Stagehand 依赖 LLM 大语言模型来实现 AI 功能，需要准备 OpenAI API 密钥（OpenAI GPT-4o模型）或 Anthropic API 密钥（Anthropic Claude 3.5 Sonnet 模型）。

准备完成后，使用 npm 进行依赖安装，并运行启动：

cd my-appnpm installnpm run start

我们简单看一些使用例子：

await page.act({ action: "click the login button" });const productInfo = await page.extract({ instruction: "find the red shoes", schema: z.object({ productName: z.string, price: z.number, }),});

上述例子中，应用了 act 和 extract 接口，给出以下指令：首先去点击登录按钮，然后从页面中找到红色鞋子的商品，并提取产品名和价格。可以看到，这里使用了十分简单的自然语言，完成了从前较为复杂的网页交互和数据爬取功能。

Stagehand 还提供了 observe 接口，专注于监测获取数据：

const actions = await page.observe;console.log("Possible actions:", actions);// You can also use `observe` with a custom promptconst buttons = await page.observe({ instruction: "find all the buttons on the page",});