Stagehand 快速上手教程3 步搭出能自然语言操作的 AI 浏览器助手【免费下载链接】stagehandThe SDK For Browser Agents项目地址: https://gitcode.com/GitHub_Trending/stag/stagehand给网页写自动化脚本大多逃不出一个循环页面一改版手写选择器就失效脚本跟着报废重新调试又是一轮。Stagehand 是 Browserbase 出品的、用于构建 AI 浏览器助手的 SDK——你把点击登录按钮写成一句自然语言由 AI 自己定位元素并完成操作页面结构变化后它能检测差异并自动恢复动作路径。TypeScript、Python、Go 三端 SDK 同步维护本文带你用三步跑通一个能操作真实网页的 Demo。传统做法里提取公司名和批次号这类任务要手写evaluate遍历 DOM、靠正则从文本里抠字段站点改一个 class 名整个解析链就断了。Stagehand 的解法是把定位 解析这一层整个替换掉用三个原语覆盖几乎所有页面任务act一句话描述操作点击、填表、滚动代替手写选择器和动作序列observe让 AI 列出当前页面可交互的元素和建议动作相当于给页面做体检extract传入 zod schema直接拿回类型化的结构化对象替代正则解析。为什么手写选择器总会坏上面这张对比图很直观右边是一堆querySelectorAll加文本判断的解析代码站点稍有改动就要跟着改左边一行extract指令加 schema 就完成了同样的提取。Stagehand 的 act 是自愈的——执行前会核对元素是否还在预期位置站点改版后它会自动刷新操作方式而不是抛一个元素未找到让你回去改选择器。另外它通过 CDP 协议驱动浏览器且内置一个跑在浏览器扩展里的驱动进程动作往返延迟比远程遥控方案更低。三个原语操作、观察、取数三个原语都挂在stagehand实例上接受自然语言指令await stagehand.act(Click the Evals button.); // 操作 const { data } await stagehand.observe(What can I click on this page?); // 观察 const { data } await stagehand.extract( Extract the value proposition from the page., z.object({ valueProposition: z.string() }) // 取数 );对确定性的批量操作也可以拿observe返回的 selector 走 Playwright 风格的page.locator(selector).click()两条路径可以混用。安装与环境准备 环境要求Node.js 22.18推荐 Node 运行时。v4 版本通过 CDP 直接驱动浏览器没有 Playwright 依赖安装只有两个包# npm install browserbasehq/stagehand zod 也可以 pnpm add browserbasehq/stagehand zod如果你打算用 Browserbase 云浏览器跑本地什么都不用装若要localBrowser.launch()在本机跑则机器上需要装好 Chrome。Python 用户用pip install stagehandGo 用户用go get获取 SDK。官方文档packages/docs/v4/first-steps/installation.mdxAPI 密钥怎么配只需一个密钥BROWSERBASE_API_KEY在 Browserbase 官网 Dashboard 的 Project 设置里能同时看到 Project ID 和 API Key。模型侧不需要单独配 key——未指定模型时Model Gateway 会为每次推理调用自动选择模型。一个容易踩的点Stagehand 不会替你读环境变量也不自动加载.env。密钥要在你自己的代码里读出、显式传给浏览器工厂示例代码即按此写法。浏览器来源、超时、日志等配置见packages/docs/v4/configuration/browser.mdx三步跑通 Demo写脚本新建index.ts下面 14 行覆盖 goto、extract、act 全链路import { browserbase, Stagehand } from browserbasehq/stagehand; import { z } from zod/v4; const browser await browserbase.launch({ apiKey: process.env.BROWSERBASE_API_KEY, }); const stagehand await Stagehand.create({ browser }); const [page] await browser.context.pages(); await page.goto(https://stagehand.dev); // extract按 schema 提取结构化数据 const { data } await stagehand.extract( Extract the value proposition from the page., z.object({ valueProposition: z.string() }) ); console.log(data); // act一句话执行点击操作 await stagehand.act(Click the Evals button.);设密钥、运行export BROWSERBASE_API_KEYbb_live_... # 你的 Browserbase API 密钥 pnpm dlx tsx index.ts # 运行脚本看结果终端先打印 extract 拿到的valueProposition字符串再看到页面里 Evals 按钮被 AI 点下去——这就是一个能操作真实网页的 AI 浏览器助手的完整闭环。 开发期不想走云浏览器把browserbase.launch()换成localBrowser.launch()即可在本地 Chrome 上调试。▶️ 运行效果类似这样——左边是脚本右边是助手在执行滚动、点击等指令完整分步流程参考packages/docs/v4/first-steps/quickstart.mdx从 Demo 到真实使用仓库自带示例act、extract、observe、caching、customLlm、webmcp 等场景都有可运行的 TypeScript 示例照着改最快Python / Go 用户三端 API 对齐同一套原语在stagehandpip和 Go SDK 中同样可用接入 AI 工具链仓库提供 Claude Code、Codex、CrewAI、LangChain 等集成包可以把 AI 浏览器助手挂到你现有的 agent 框架里。下一步建议翻一遍示例目录挑一个场景跑起来packages/sdk-ts/examples/精读三个原语的参考文档搞清参数与返回结构packages/docs/v4/basics/act.mdx要上生产前先看缓存与成本控制两篇能省不少推理开销packages/docs/v4/best-practices/【免费下载链接】stagehandThe SDK For Browser Agents项目地址: https://gitcode.com/GitHub_Trending/stag/stagehand创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考