一、Stagehand概述

Stagehand是由Browserbase团队维护的人工智能驱动的网页浏览框架，旨在成为Playwright的后继者。它不仅继承了Playwright的强大功能，还引入了创新的设计理念，以满足现代网页自动化的需求。Stagehand的核心在于其简洁而强大的API设计，包括act、extract和observe，这三个API共同构成了构建自然语言驱动的网页自动化操作的基石。

二、Stagehand核心功能

1、自然语言驱动的自动化

2、原子化指令执行

每个Stagehand函数接受一个原子指令，生成相应的Playwright代码来完成该指令，并执行它。这种原子化指令执行提高了自动化任务的可靠性，因为它确保了每个操作都是独立且明确的，从而减少了错误和冲突的可能性。

3、模型和提供商支持

Stagehand支持多种语言模型和模型提供商，包括OpenAI和Anthropic，允许开发者根据需求选择最合适的模型。这种灵活性使得Stagehand能够适应不同的自动化任务和场景。

4、观察和建议行动

使用observe()函数，开发者可以获取当前页面上可执行的操作列表，辅助规划和执行自动化步骤。这一功能在自动化测试和监控网页内容变化时非常有用，它可以帮助开发者了解当前网页的状态，并据此做出相应的自动化决策。

三、Stagehand技术原理

Stagehand基于自然语言处理技术解析和理解用户提供的自然语言指令。这些指令被转换成具体的网页操作，如点击、填写表单、提取数据等。

2、指令到代码的转换

Stagehand将自然语言指令转换成可执行的代码，通常是Playwright的API调用。这一过程涉及解析指令、确定操作的具体步骤，生成相应的代码。

3、原子化操作

每个指令都是原子化的，是不可分割的最小操作单元。原子化操作有助于提高自动化流程的稳定性和可靠性。

4、上下文感知

Stagehand基于`observe()`函数理解当前网页的上下文，有助于确定可执行的操作。上下文感知能力让Stagehand提供更智能的自动化建议。

5、模块化支持

Stagehand设计为模块化，支持不同的AI模型和模型提供商。这种设计使得Stagehand能够灵活地集成和切换不同的AI能力，适应不同的自动化需求。

四、Stagehand应用场景

Stagehand作为一个简单和可扩展的人工智能网页浏览框架，其应用场景广泛，覆盖了从基本的网页测试到复杂的数据抓取和电子商务等多个领域。以下是Stagehand的一些主要应用场景：

自动化测试网页功能，确保网站在不同浏览器和设备上正常工作。这包括测试网页的响应性、兼容性以及用户体验。通过Stagehand，开发者可以模拟用户行为，如点击、滚动和表单提交，以验证网页的交互功能是否按预期工作。

2、数据抓取

从网页中提取大量数据，用于数据分析、研究或内容聚合。Stagehand的自然语言驱动的自动化能力使得数据抓取变得更加简单和高效，开发者可以用自然语言指令来指定需要抓取的数据，Stagehand会自动执行相应的操作并提取数据。

3、表单填写与提交

自动化填写在线表单，如注册、登录、问卷调查等。这可以显著提高数据收集的效率，减少手动输入的工作量，并降低出错率。Stagehand可以识别表单字段并自动填写所需信息，然后提交表单。

4、网页内容监控

监控网页内容变化，如价格更新、新闻发布等，及时获取信息。这对于需要实时跟踪网页更新的业务至关重要，例如股票价格监控或新闻聚合服务。Stagehand可以定期检查网页内容，并在检测到变化时触发相应的操作。

5、自动化办公

自动化执行日常的网页相关任务，提高工作效率。这可能包括自动登录到Web应用、自动处理电子邮件、日程安排等。Stagehand的自动化能力可以帮助办公室工作人员减少重复性工作，提高生产力。

Stagehand的灵活性和可扩展性使其成为一个多功能的工具，适用于各种不同的自动化需求。随着技术的不断发展，Stagehand的应用场景将进一步扩展，为更多的业务问题提供解决方案。

五、如何运行Stagehand

1、安装 Stagehand 包

npm install @browserbasehq/stagehand zod

您需要为要使用的模型提供商提供 API 密钥。默认模型提供商是 OpenAI，但您也可以使用 Anthropic 或其他提供商。有关受支持模型的更多信息，请参阅API 参考。

确保您的本地环境中可以访问 OpenAI API 密钥或 Anthropic API 密钥。

export OPENAI_API_KEY=sk-...export ANTHROPIC_API_KEY=sk-...

3、创建 Stagehand 实例

如果您计划在本地运行浏览器，您还需要安装 Playwright 的浏览器依赖项。

npm exec playwright install

然后你可以像这样创建一个 Stagehand 实例：

import { Stagehand } from "@browserbasehq/stagehand";import { z } from "zod";
const stagehand = new Stagehand({env: "LOCAL",});

如果您计划远程运行浏览器，则需要设置 Browserbase API 密钥和项目 ID。

export BROWSERBASE_API_KEY=...export BROWSERBASE_PROJECT_ID=...import { Stagehand } from "@browserbasehq/stagehand";import { z } from "zod";
const stagehand = new Stagehand({   env: "BROWSERBASE",   enableCaching: true,});

4、运行你的第一个自动化

await stagehand.init();await stagehand.page.goto("https://github.com/browserbase/stagehand");await stagehand.act({ action: "click on the contributors" });const contributor = await stagehand.extract({instruction: "extract the top contributor",schema: z.object({username: z.string(),url: z.string(),}),});console.log(`Our favorite contributor is ${contributor.username}`);

这个简单的代码片段将打开一个浏览器，导航到 Stagehand 仓库，并记录顶级贡献者。

结语

Stagehand作为一个新兴的AI网页浏览框架，以其简单、可扩展和自然语言驱动的特点，为网页自动化操作提供了一个强大的工具。随着AI技术的不断发展，Stagehand有望在未来的网页自动化领域发挥更大的作用。想要了解更多关于Stagehand的信息，可以访问其GitHub仓库。