Tự động hóa trình duyệt từ lâu đã là nền tảng của phát triển phần mềm, kiểm thử và trích xuất dữ liệu hiện đại. Trong nhiều năm, các framework như Selenium, Puppeteer, và gần đây hơn là Playwright, đã thống trị lĩnh vực này. Các công cụ này cung cấp khả năng kiểm soát chi tiết các hành động của trình duyệt, nhưng chúng đi kèm với đường cong học tập dốc và gánh nặng bảo trì đáng kể. Các script thường dễ gãy, bị lỗi chỉ với một thay đổi nhỏ trong giao diện người dùng của trang web. Ở phía khác của phổ, một làn sóng mới các tác nhân AI-native hứa hẹn tự động hóa các tác vụ phức tạp bằng ngôn ngữ tự nhiên, nhưng thường phải trả giá bằng độ tin cậy, khả năng dự đoán và kiểm soát.
Giới thiệu Stagehand, một framework tự gọi mình là "Framework Tự động hóa Trình duyệt AI". Nó không nhằm mục đích thay thế các công cụ đã được thử nghiệm như Playwright mà là để khuếch đại chúng. Được xây dựng trên nền tảng Playwright, Stagehand tích hợp một lớp AI mạnh mẽ, cho phép các nhà phát triển kết hợp tự động hóa truyền thống dựa trên mã code với các hướng dẫn cấp cao bằng ngôn ngữ tự nhiên.
Muốn có một nền tảng tích hợp, Tất cả trong Một cho Đội ngũ Phát triển của bạn làm việc cùng nhau với năng suất tối đa?
Apidog đáp ứng mọi yêu cầu của bạn, và thay thế Postman với mức giá phải chăng hơn nhiều!
Nhưng nó thực sự tốt đến mức nào? Nó có đạt được sự cân bằng phù hợp giữa độ chính xác của mã code và sự linh hoạt của AI không? Bài đánh giá và hướng dẫn chuyên sâu này sẽ khám phá các khái niệm cốt lõi của Stagehand, đi qua các ví dụ thực tế và đánh giá vị trí của nó trong thế giới tự động hóa trình duyệt đang phát triển nhanh chóng.
Tại sao lại là Stagehand? Vấn đề với các cách làm cũ
Trước khi đi sâu vào "cách làm", điều quan trọng là phải hiểu "tại sao". Tự động hóa trình duyệt truyền thống về cơ bản là nói cho trình duyệt biết chính xác phải làm gì. Một script điển hình trong Playwright có thể trông như thế này:
// Find an element by its CSS selector and click it
await page.locator('button[data-testid="login-button"]').click();
// Find an input field and type into it
await page.locator('input[name="username"]').fill('my-user');
Cách tiếp cận này chính xác và đáng tin cậy... cho đến khi nó không còn như vậy nữa. Khoảnh khắc một nhà phát triển thay đổi data-testid hoặc tái cấu trúc cấu trúc HTML của form, script sẽ bị lỗi. Việc duy trì các bộ chọn này trên một bộ kiểm thử lớn hoặc một dự án cào dữ liệu web phức tạp trở thành một công việc tẻ nhạt và vô ơn.
Hãy xem bản demo được cung cấp bởi nhóm Stagehand:
Các tác nhân AI cấp cao cố gắng giải quyết vấn đề này bằng cách trừu tượng hóa các chi tiết triển khai. Bạn chỉ cần nói với tác nhân, "Đăng nhập bằng thông tin đăng nhập của tôi," và nó sẽ tìm ra các bước cần thiết. Mặc dù điều này nghe có vẻ kỳ diệu, nhưng nó có thể không dự đoán được trong môi trường sản xuất. Tác nhân có thể thất bại trên một giao diện người dùng không quen thuộc, đi theo một đường dẫn không hiệu quả hoặc hiểu sai hướng dẫn, dẫn đến kết quả không nhất quán.
Stagehand nhằm mục đích đưa ra một con đường trung dung. Nó nhận ra rằng đôi khi bạn biết *chính xác* mình muốn làm gì (ví dụ: await page.goto('https://github.com')), và những lúc khác bạn muốn giao phó "cách làm" cho AI (ví dụ: await page.act('click on the stagehand repo')). Cách tiếp cận kết hợp này là đề xuất giá trị cốt lõi của Stagehand.
Các Trụ cột Cốt lõi của Stagehand
Stagehand nâng cao đối tượng `Page` của Playwright với ba phương thức chính: `act`, `extract` và `observe`. Nó cũng giới thiệu một `agent` mạnh mẽ để xử lý các tác vụ phức tạp hơn, nhiều bước.
`act`: Thực hiện Hành động bằng Ngôn ngữ Tự nhiên
Phương thức `act` là trái tim của các khả năng tương tác của Stagehand. Nó nhận một hướng dẫn bằng tiếng Anh đơn giản và thực hiện hành động tương ứng trên trang.
// Instead of brittle selectors...
await page.act("Click the sign in button");
await page.act("Type 'hello world' into the search input");
Đằng sau hậu trường, một mô hình AI phân tích trạng thái hiện tại của trang web (DOM), xác định các phần tử tương tác liên quan nhất (nút, liên kết, trường nhập) và ánh xạ hướng dẫn tới một hành động cụ thể, như nhấp chuột hoặc nhấn phím. Điều này làm cho các script có khả năng chống chịu tốt hơn với những thay đổi nhỏ về giao diện người dùng. Miễn là con người có thể xác định "nút đăng nhập", Stagehand cũng có thể làm được điều đó, ngay cả khi mã code cơ bản của nó đã thay đổi.
Chìa khóa để sử dụng `act` hiệu quả là giữ cho các hướng dẫn mang tính nguyên tử và cụ thể. Một hướng dẫn như "Đặt cho tôi một chiếc pizza" là quá cấp cao đối với `act`. Thay vào đó, bạn sẽ chia nhỏ nó thành một chuỗi các bước nguyên tử: "Nhấp vào pizza pepperoni," "Chọn kích thước 'large'," "Thêm vào giỏ hàng," và "Tiến hành thanh toán."
`observe` và Bộ nhớ đệm: Thêm Khả năng Dự đoán cho AI
Một mối quan tâm phổ biến khi sử dụng AI là tính không thể đoán trước. Liệu mô hình có chọn đúng phần tử mọi lúc không? Stagehand giải quyết vấn đề này bằng phương thức `observe`. `observe` không thực hiện một hành động; nó trả về một danh sách các hành động *tiềm năng* khớp với hướng dẫn.
const [action] = await page.observe("Click the sign in button");
Đối tượng `action` được trả về là một mô tả có thể tuần tự hóa về hoạt động mà Stagehand dự định thực hiện. Bạn có thể kiểm tra nó, ghi log nó, và quan trọng nhất là đưa nó trực tiếp trở lại vào `act`:
const [action] = await page.observe("Click the sign in button");
await page.act(action);
Quá trình hai bước này cung cấp tính năng "xem trước" mạnh mẽ. Nhưng sức mạnh thực sự của nó nằm ở bộ nhớ đệm (caching). Đối với các tác vụ lặp đi lặp lại, bạn có thể `observe` một hành động một lần, lưu kết quả và sử dụng lại trong các lần chạy tiếp theo.
const instruction = "Click the sign in button";
let cachedAction = await getFromCache(instruction);
if (cachedAction) {
await page.act(cachedAction);
} else {
const [observedAction] = await page.observe(instruction);
await saveToCache(instruction, observedAction);
await page.act(observedAction);
}
Chiến lược bộ nhớ đệm này mang lại một số lợi ích:
- Độ tin cậy: Nó đảm bảo hành động chính xác được thực hiện mọi lúc, loại bỏ sự biến đổi của mô hình AI.
- Tốc độ: Nó bỏ qua nhu cầu gọi AI, làm cho quá trình tự động hóa nhanh hơn đáng kể.
- Chi phí: Nó tiết kiệm các cuộc gọi API tới mô hình ngôn ngữ cơ bản, giảm chi phí vận hành.
`extract`: Trích xuất Dữ liệu Thông minh
Cào dữ liệu từ một trang web bằng các công cụ truyền thống liên quan đến việc viết các bộ chọn CSS hoặc XPath để xác định dữ liệu. Đây là một hình thức kết nối dễ gãy khác với giao diện người dùng. Phương thức `extract` của Stagehand cách mạng hóa quá trình này bằng cách cho phép bạn chỉ định những gì bạn muốn trích xuất bằng ngôn ngữ tự nhiên.
Bạn có thể tùy chọn cung cấp một schema Zod để đảm bảo đầu ra được cấu trúc chính xác. Zod là một thư viện khai báo và xác thực schema ưu tiên TypeScript phổ biến, và việc tích hợp nó ở đây là một yếu tố thay đổi cuộc chơi.
Hãy tưởng tượng bạn đang ở trên trang yêu cầu kéo (pull request) của GitHub và muốn lấy tên người dùng của tác giả và tiêu đề của PR. Với `extract`, nó đơn giản như thế này:
import { z } from "zod";
// ... inside an async function
const { author, title } = await page.extract({
instruction: "extract the author and title of the PR",
schema: z.object({
author: z.string().describe("The username of the PR author"),
title: z.string().describe("The title of the PR"),
}),
});
console.log(`PR: "${title}" by ${author}`);
AI của Stagehand đọc trang, hiểu ngữ cảnh và điền dữ liệu được yêu cầu vào schema Zod. Điều này mạnh mẽ hơn nhiều so với việc dựa vào các bộ chọn như `#pull_request_header .author` có thể thay đổi bất cứ lúc nào. Bạn thậm chí có thể trích xuất dữ liệu lồng ghép phức tạp, bao gồm cả mảng các đối tượng, bằng cách định nghĩa schema Zod phù hợp.
`agent`: Dành cho các Tác vụ Tự hành, Nhiều bước
Trong khi `act` dành cho các hành động đơn lẻ, nguyên tử, thì `agent` dùng để điều phối các mục tiêu lớn hơn, phức tạp hơn. Agent có thể nhận một mục tiêu cấp cao và tự mình chia nhỏ nó thành một chuỗi các lệnh gọi `act` và `extract`.
// Navigate to a website
await stagehand.page.goto("https://www.google.com");
const agent = stagehand.agent({
provider: "openai",
model: "gpt-4o", // Or an Anthropic model
});
// Execute the agent
await agent.execute(
"Find the official website for the Stagehand framework and tell me who developed it."
);
Agent cung cấp trải nghiệm "con người trong vòng lặp" (human-in-the-loop) cho các script tự động hóa của bạn. Nó lý tưởng cho các tác vụ khám phá hoặc điều hướng các trang web phức tạp, không quen thuộc, nơi việc định nghĩa trước mọi bước sẽ không thực tế. Nó hỗ trợ các mô hình hàng đầu từ cả OpenAI và Anthropic, mang đến cho các nhà phát triển khả năng truy cập vào các khả năng AI tiên tiến nhất với thiết lập tối thiểu.
Bắt đầu: Một Hướng dẫn Mini để Sử dụng Stagehand Team
Xem Anirudh demo `create-browser-app` để tạo một dự án Stagehand tại đây:
Cách nhanh nhất để bắt đầu một dự án Stagehand là sử dụng công cụ dòng lệnh của họ.
npx create-browser-app my-stagehand-project
cd my-stagehand-project
Điều này tạo ra một dự án mới với tất cả các phụ thuộc cần thiết, tệp cấu hình và một script mẫu. Bạn sẽ cần thêm khóa API của mình cho nhà cung cấp LLM (như OpenAI hoặc Anthropic) và tùy chọn khóa Browserbase (để thực thi trình duyệt trên đám mây) vào tệp `.env`.
Một script cơ bản trông như thế này:
import { Stagehand } from "@browserbasehq/stagehand";
import StagehandConfig from "./stagehand.config"; // Your project's config
import { z } from "zod";
async function main() {
// 1. Initialize Stagehand
const stagehand = new Stagehand(StagehandConfig);
await stagehand.init();
const page = stagehand.page;
try {
// 2. Navigate to a page
await page.goto("https://github.com/trending");
// 3. Perform actions
await page.act("Click on the first repository in the list");
// 4. Extract data
const { description } = await page.extract({
instruction: "Extract the repository description",
schema: z.object({
description: z.string(),
}),
});
console.log("Repository description:", description);
} finally {
// 5. Clean up
await stagehand.close();
}
}
main();
Ví dụ đơn giản này minh họa toàn bộ vòng đời: khởi tạo, điều hướng, hành động, trích xuất và dọn dẹp. Nó sạch sẽ, dễ đọc và đặc biệt có khả năng chống chịu tốt với những thay đổi về giao diện người dùng trên trang xu hướng của GitHub.
Lời phán quyết: Nó tốt đến mức nào?
Sau khi tìm hiểu sâu về các tính năng và triết lý của nó, rõ ràng Stagehand không chỉ là một công cụ tự động hóa khác. Nó là một framework chu đáo và mạnh mẽ, đã thành công trong việc kết nối khoảng cách giữa tự động hóa truyền thống nặng về mã code và thế giới mới đầy hứa hẹn của các tác nhân AI.
Ưu điểm:
- Trải nghiệm Nhà phát triển: Bằng cách xây dựng trên nền tảng Playwright, nó cung cấp một API quen thuộc cho nhiều nhà phát triển. Việc bổ sung `act` và `extract` giúp viết các script tự động hóa nhanh hơn và trực quan hơn.
- Khả năng chống chịu: Các script ít bị gãy hơn nhiều và có khả năng chống chịu tốt hơn với những thay đổi về giao diện người dùng, giảm đáng kể gánh nặng bảo trì.
- Kiểm soát & Khả năng dự đoán: Cơ chế `observe` và bộ nhớ đệm là một giải pháp tuyệt vời cho vấn đề không thể đoán trước của AI, giúp nó khả thi cho các trường hợp sử dụng trong sản xuất.
- Sức mạnh & Tính linh hoạt: Sự kết hợp giữa các lệnh gọi `act` nguyên tử, schema `extract` thông minh và `agent` cấp cao cung cấp một loạt các công cụ phù hợp cho hầu hết mọi tác vụ tự động hóa trình duyệt.
- Trích xuất Dữ liệu có cấu trúc: Việc tích hợp với Zod cho `extract` là một tính năng nổi bật, giúp việc cào dữ liệu dễ dàng và đáng tin cậy hơn bao giờ hết.
Nhược điểm tiềm năng:
- Phụ thuộc vào LLM: Chất lượng của quá trình tự động hóa phụ thuộc vào hiệu suất của các mô hình AI cơ bản. Mặc dù các mô hình hiện nay cực kỳ có khả năng, nhưng chúng không hoàn hảo.
- Chi phí: Các cuộc gọi API tới các mô hình mạnh mẽ không miễn phí. Mặc dù chiến lược bộ nhớ đệm giúp giảm thiểu điều này, việc sử dụng với khối lượng lớn có thể phát sinh chi phí.
- Đường cong học tập: Mặc dù đơn giản hơn Playwright gốc đối với nhiều tác vụ, các nhà phát triển vẫn cần hiểu các khái niệm cốt lõi về `act`, `observe`, `extract` và khi nào sử dụng từng cái. Suy nghĩ theo hướng "hành động nguyên tử" so với "mục tiêu cấp cao" là một kỹ năng mới.
Kết luận
Vậy, Stagehand tốt đến mức nào? Nó đặc biệt tốt. Nó không phải là một viên đạn thần kỳ, nhưng nó đại diện cho một bước tiến đáng kể trong tự động hóa trình duyệt. Nó trao quyền cho các nhà phát triển xây dựng các quy trình tự động hóa mạnh mẽ hơn, thông minh hơn và có khả năng hơn với ít công sức hơn. Bằng cách cho bạn lựa chọn viết mã cấp thấp khi cần độ chính xác và sử dụng AI cấp cao khi cần sự linh hoạt, Stagehand cung cấp một bộ công cụ thực dụng và mạnh mẽ cho nhà phát triển hiện đại.
Nếu bạn là một kỹ sư QA mệt mỏi với việc cập nhật các bộ chọn, một nhà khoa học dữ liệu đang tìm kiếm một cách tốt hơn để cào web, hoặc một nhà phát triển xây dựng các quy trình làm việc phức tạp dựa trên trình duyệt, Stagehand không chỉ đáng để xem xét—nó có thể trở thành công cụ yêu thích mới của bạn. Nó đã thành công trong việc thực hiện lời hứa của mình, trở thành ứng cử viên hàng đầu cho danh hiệu "Framework Tự động hóa Trình duyệt AI".
Muốn có một nền tảng tích hợp, Tất cả trong Một cho Đội ngũ Phát triển của bạn làm việc cùng nhau với năng suất tối đa?
Apidog đáp ứng mọi yêu cầu của bạn, và thay thế Postman với mức giá phải chăng hơn nhiều!