Stagehand AI 瀏覽器自動(dòng)化實(shí)戰(zhàn)一個(gè)腳本跑通網(wǎng)頁(yè)數(shù)據(jù)采集全流程【免費(fèi)下載鏈接】stagehandThe SDK For Browser Agents項(xiàng)目地址: https://gitcode.com/GitHub_Trending/stag/stagehandStagehand 是一個(gè) AI 瀏覽器自動(dòng)化 SDK用 act、extract、observe 三個(gè)原語驅(qū)動(dòng)瀏覽器讓你不寫選擇器就能完成點(diǎn)擊、填表和抓取。本文用本地瀏覽器搭一條完整的網(wǎng)頁(yè)數(shù)據(jù)采集鏈路打開列表頁(yè)觀察可操作元素點(diǎn)擊進(jìn)入詳情頁(yè)最后把結(jié)構(gòu)化數(shù)據(jù)提取出來。 場(chǎng)景從電商頁(yè)采集商品數(shù)據(jù)假設(shè)你需要從一個(gè)商品列表頁(yè)批量抓取商品名和價(jià)格再交給下游程序處理。手寫選擇器很脆弱站點(diǎn)一改版腳本就失效。用 Stagehand 的 AI 瀏覽器自動(dòng)化你只用自然語言描述意圖元素定位交給模型。跟完下面幾步你會(huì)得到一個(gè)在本機(jī)跑通的自動(dòng)化腳本。 動(dòng)手準(zhǔn)備3 條命令裝好 Stagehand本地運(yùn)行需要 Node.js 22.18 和已安裝的 Chrome。初始化項(xiàng)目并安裝 SDKmkdir my-stagehand-app cd my-stagehand-app pnpm init -y pnpm install browserbasehq/stagehand zod 分步實(shí)現(xiàn)1. 啟動(dòng)本地瀏覽器并創(chuàng)建實(shí)例先用localBrowser在本機(jī)啟動(dòng)一個(gè) Chrome再把它交給Stagehand.create()。開發(fā)階段用headless: false你能直接看到瀏覽器每一步動(dòng)作方便排查import { localBrowser, Stagehand } from browserbasehq/stagehand; import { z } from zod/v4; const browser await localBrowser.launch({ headless: false }); const stagehand await Stagehand.create({ browser }); const [page] await browser.context.pages(); await page.goto(https://example-store.com);2. 用 observe 預(yù)覽頁(yè)面上能做什么動(dòng)手前先偵查observe返回當(dāng)前頁(yè)面上可執(zhí)行的操作列表。返回的Action對(duì)象之后可以直接回放不再觸發(fā)模型推理這是 Stagehand 省錢提速的核心模式const { data: actions } await stagehand.observe(Find all product links); console.log(actions.map((a) a.actionDescription)); // 偵查滿意后執(zhí)行第一個(gè)動(dòng)作 await stagehand.act(click the first product link);3. extract 提取結(jié)構(gòu)化數(shù)據(jù)進(jìn)入詳情頁(yè)后用extract配 Zod schema 取值。Stagehand 會(huì)先按 schema 校驗(yàn)再返回你拿到的是強(qiáng)類型數(shù)據(jù)直接落盤或?qū)懭霐?shù)據(jù)庫(kù)const { data } await stagehand.extract( extract the product name and price, z.object({ name: z.string(), price: z.number() }), ); console.log(data); // { name: Keyboard, price: 199 } 調(diào)優(yōu)進(jìn)階成本與速度問題每步都走大模型慢且貴。手段默認(rèn)掛便宜模型只在關(guān)鍵提取調(diào)用上換強(qiáng)模型單次調(diào)用即可覆蓋。問題重復(fù)運(yùn)行任務(wù)時(shí)重復(fù)計(jì)費(fèi)。手段切到 Browserbase 云瀏覽器并開啟緩存相同調(diào)用直接返回緩存結(jié)果不消耗任何 token。const stagehand await Stagehand.create({ browser, // 換成 browserbase.launch({ apiKey }) 得到 model: { modelName: google/gemini-2.5-flash }, // 默認(rèn)用便宜模型 cache: { threshold: 1 }, // 一次相同結(jié)果后開始命中緩存 });? 常見問題緩存為什么一直不命中本地瀏覽器沒有緩存服務(wù)cache選項(xiàng)不生效必須用browserbase.launch()啟動(dòng)。另外指令措辭是緩存鍵的一部分換同義詞就會(huì)變成新鍵。act 點(diǎn)錯(cuò)元素怎么辦先用observe確認(rèn)頁(yè)面實(shí)際內(nèi)容再給調(diào)用傳locator把快照范圍收斂到你關(guān)心的容器減少無關(guān)干擾。支持 Python 和 Go 嗎支持。三個(gè)原語語義與 TypeScript 版一致分別用 Pydantic 模型和 Go 結(jié)構(gòu)體替代 Zod schemaAPI key 也換成對(duì)應(yīng)語言的 launch 參數(shù)傳遞。 延伸閱讀快速上手packages/docs/v4/first-steps/quickstart.mdxact 完整參考packages/docs/v4/basics/act.mdxobserve 完整參考packages/docs/v4/basics/observe.mdx緩存最佳實(shí)踐packages/docs/v4/best-practices/caching.mdxSDK 核心源碼packages/sdk-ts/src/stagehand.ts【免費(fèi)下載鏈接】stagehandThe SDK For Browser Agents項(xiàng)目地址: https://gitcode.com/GitHub_Trending/stag/stagehand創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考