一款基于Playwright的新一代AI浏览器自动化框架！卷起来

关注

原创最新推荐文章于 2026-05-28 11:28:47 发布 1.9k 阅读 AI 写同款· GEO 优化 ›

MCP-Playwright：AI自动化神器，一款超级好用的自动化测试框架！而今天，给大家介绍一款自动化测试工具：MCP-Playwright，它融合了先进的 AI 技术，不仅能让AI直接操控浏览器，更是通过标准化协议打通了测试工具链，让自动化测试变得像“说话一样简单”，为自动化测试带来了全新的体验。阅读详情

📝 面试求职： 「面试试题小程序」，内容涵盖测试基础、Linux操作系统、MySQL数据库、Web功能测试、接口测试、APPium移动端测试、Python知识、Selenium自动化测试相关、性能测试、性能测试、计算机网络知识、Jmeter、HR面试，命中率杠杠的。（大家刷起来…）

📝 职场经验干货：

软件测试工程师简历上如何编写个人信息（一周8个面试）

软件测试工程师简历上如何编写专业技能（一周8个面试）

软件测试工程师简历上如何编写项目经验（一周8个面试）

软件测试工程师简历上如何编写个人荣誉（一周8个面试）

软件测试行情分享（这些都不了解就别贸然冲了.）

软件测试面试重点，搞清楚这些轻松拿到年薪30W+

软件测试面试刷题小程序免费使用（永久使用）

数智化时代，浏览器的使用者正在逐渐从人类用户转移到 AI Agent，Agent 与互联网环境互动的底层设施也因此正在变得越来越重要。传统浏览器已经无法满足AI Agent 自动化抓取、交互和实时数据处理的需求。

在此背景下，Stagehand作为新一代人工智能网页浏览框架应运而生。该框架以其简单性和可扩展性脱颖而出，成为开发者的新宠，被称为是“自动化领域的瑞士军刀”！这么牛吗？今天带领大家一起揭开“Stagehand”的神秘面纱！

阅读本文你将收获：

Stagehand是什么；
Stagehand的核心优势；
Stagehand VS 传统浏览器自动化工具（如 Selenium /Playwright）；
Stagehand的安装教程；
Stagehand的应用案例。

01 Stagehand是什么

Stagehand是由Browserbase团队维护的人工智能驱动的网页浏览框架，结合了 AI 代理、AI 工具和 Playwright，旨在成为Playwright的后继者。它的核心理念是：让自动化任务既可控又智能。

适合人群包括：

爬虫工程师：快速抓取动态渲染的网页数据；
测试工程师：用自然语言编写自动化测试用例；
RAG开发者：构建智能网页内容提取管道；
电商运营：自动化价格监控、库存检查等重复任务。

02 Stagehand的5大核心优势

优势1：自然语言驱动（用“说人话”的方式操控浏览器）

通过act("点击登录按钮")、extract("提取价格信息")等简单指令完成操作，无需编写复杂选择器；
支持多模型切换（OpenAI/Anthropic/Gemini等），适应不同场景需求。

优势2：双模式协作（代码与AI的“冰与火之歌”）

代码模式：直接调用Playwright API精准控制；
AI模式：用自然语言描述任务，自动生成并执行代码。

优势3：智能上下文感知（让自动化脚本“长眼睛”）

observe()函数可获取页面可操作元素列表，为AI提供决策依据
自动处理动态内容加载、iframe嵌套等复杂场景

优势4：企业级可观测性（给自动化装上“黑匣子”）

详细记录操作日志和Token消耗，支持性能分析和成本优化；
内置错误恢复机制，自动化任务更稳定。

优势5：生产就绪架构（为规模化而生）

支持本地和云端（Browserbase）两种运行模式；
动作预缓存功能可大幅降低LLM调用成本。

03 Stagehand VS 传统浏览器自动化工具

Stagehand 与传统浏览器自动化工具（如 Selenium 或 Playwright）的核心区别在于 AI 驱动的智能化和自适应性。以下是具体对比：

1.元素定位逻辑

2.动态内容处理

3.脚本生成与维护

4.学习曲线与适用人群

5.扩展能力

04 Stagehand的安装教程

1、安装 Stagehand 包

npm install @browserbasehq/stagehand zod

2、配置模型提供程序

您需要为要使用的模型提供商提供 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 仓库，并记录顶级贡献者。

05 Stagehand的应用案例

案例1：动态价格监控与数据抓取（电商场景）

场景需求：自动抓取某电商网站（如Amazon）的特定商品价格，当价格低于设定阈值时发送邮件通知。

传统方法痛点：

需要手动处理页面动态加载、反爬机制、XPath/CSS选择器维护。
价格元素位置可能随时变化，脚本易失效。

Stagehand实现代码：

from stagehand import BrowserAI
import smtplib

# 初始化Stagehand AI驱动浏览器
browser = BrowserAI(headless=False)

# 自然语言指令定义任务
task = """
1. 打开亚马逊网站，搜索商品名"iPhone 15 128GB"。
2. 在搜索结果中找到官方自营商品链接。
3. 进入商品详情页，提取当前价格。
4. 如果价格低于800美元，发送邮件到user@example.com。
"""

# 执行任务并获取数据
result = browser.execute(task, params={
    "email": "user@example.com",
    "price_threshold": 800
})

# 发送邮件逻辑（Stagehand自动触发）
# 用户只需配置SMTP信息即可，无需手动编码

关键AI优化：

元素定位：通过语义理解找到“官方自营”标签，而非依赖固定XPath。
动态适应：若页面结构变化（如价格从<span class="price">变为<div id="new-price">），AI自动修正选择器。
反爬绕过：自动模拟人类滚动和点击行为，避免被识别为机器人。

案例2：跨系统数据录入（RPA场景）

场景需求：从Excel表格读取客户信息，自动登录企业CRM系统并批量录入数据。

传统方法痛点：

需要处理登录验证码、表单字段映射、异常弹窗。
CRM系统升级后需重新调整脚本。

Stagehand实现代码：

from stagehand import RPA
import pandas as pd

# 读取Excel数据
df = pd.read_excel("clients.xlsx")

# 定义自然语言流程
flow = """
1. 打开CRM登录页（URL: https://internal-crm.example.com）。
2. 识别登录表单，输入用户名{{user}}和密码{{pass}}。
3. 如果出现验证码，使用OCR识别并填写。
4. 登录后，导航至“客户管理”>“新增客户”。
5. 循环处理Excel中的每一行数据：
   - 将“姓名”填入ID为name的字段。
   - 将“邮箱”填入右侧第二个输入框（基于位置识别）。
   - 点击“保存并继续”。
6. 完成后退出系统。
"""

# 执行任务
rpa = RPA()
rpa.execute(flow, data=df, credentials={
    "user": "admin",
    "pass": "securepassword123"
})

关键AI优化：

验证码处理：集成OCR自动识别，无需手动干预。
表单映射：通过语义理解匹配Excel列名与表单字段（如“邮箱” vs “Email Address”）。
弹窗处理：自动检测并关闭“保存成功”提示或错误弹窗。

案例3：自适应Web应用测试（QA场景）

场景需求：自动生成测试用例，检测电商结账流程的异常（如库存不足、支付失败）。

传统方法痛点：

需要为每个分支（成功/失败）编写独立测试用例。
UI元素变化（如按钮ID变更）导致测试脚本大面积失效。

Stagehand实现代码：

from stagehand import Tester

# 定义测试目标（自然语言描述）
test_scenario = """
测试电商结账流程：
1. 登录测试账号（用户名: test_user，密码: test_pass）。
2. 搜索商品“无线耳机”，选择第一个结果加入购物车。
3. 进入购物车，点击“结算”。
4. 验证以下场景：
   - 如果库存充足，应跳转到支付页面。
   - 如果库存不足，页面应显示“缺货”提示。
   - 支付页面提交后，检测是否返回成功订单号。
"""

# 初始化测试器并运行
tester = Tester()
report = tester.run(
    scenario=test_scenario,
    base_url="https://demo-ecom.example.com"
)

# 生成测试报告
report.save("checkout_test.html")

关键AI优化：