Sự chuyển dịch từ Selector sang Duyệt web Ngữ nghĩa
Tôi từng mất khoảng 10 đến 15 giờ mỗi tháng chỉ để bảo trì các trình thu thập dữ liệu (scraper) dễ lỗi. Quy trình làm việc của tôi phụ thuộc vào Selenium hoặc Playwright, nơi tôi phải tỉ mỉ ánh xạ các CSS selector và biểu thức XPath. Mỗi khi một lập trình viên front-end đổi tên class từ btn-primary thành submit-button, các đoạn script của tôi sẽ bị lỗi. Cảm giác giống như trò chơi đập chuột không hồi kết.
Mô hình này đã thay đổi nhờ tự động hóa trình duyệt bằng LLM. Thay vì viết code cứng một lệnh như “nhấp vào div có ID #login-01”, giờ đây chúng ta có thể giao cho agent một mục tiêu tổng quát: “Đăng nhập vào trang web và tải xuống ba hóa đơn cuối cùng”. Đây chính là cốt lõi của Browser Use. Đây là một thư viện mã nguồn mở kết nối các LLM như Claude 3.5 Sonnet vào trình duyệt. AI không chỉ phân tích code; nó diễn giải bố cục trang bằng hình ảnh và ngữ cảnh, giống như cách con người làm.
Làm chủ công cụ này giúp chúng ta thoát khỏi các script cứng nhắc để hướng tới tự động hóa tự phục hồi. Hướng dẫn này sẽ khám phá cách triển khai Browser Use để xây dựng các agent thực sự có thể thích nghi ngay cả khi website thay đổi giao diện.
So sánh phương pháp: Truyền thống vs. Tự động hóa bằng LLM
Tại sao phải thay đổi? Sự khác biệt nằm ở cách hệ thống xử lý sự thay đổi. Các công cụ truyền thống nhanh nhưng mỏng manh. Các AI agent điều khiển bằng LLM chậm hơn nhưng cực kỳ thông minh.
Phương pháp truyền thống (Selenium/Playwright)
- Logic: Hoàn toàn dựa trên quy tắc. Nếu UI thay đổi dù chỉ 1px, script thường sẽ lỗi.
- Selectors: Yêu cầu đường dẫn DOM chính xác.
- Bảo trì: Cao. Theo kinh nghiệm của tôi, các scraper phức tạp cần cập nhật sau mỗi 2–4 tuần.
- Độ phức tạp: Khó xử lý các thành phần không xác định như cửa sổ pop-up “Đăng ký nhận bản tin” bất ngờ.
Phương pháp dựa trên LLM (Browser Use)
- Logic: Hướng mục tiêu. Bạn xác định “cái gì”, và AI sẽ tìm ra cách thực hiện (“như thế nào”).
- Selectors: Mang tính ngữ nghĩa. LLM hiểu rằng biểu tượng kính lúp có nghĩa là “tìm kiếm”, bất kể cấu trúc HTML bên dưới là gì.
- Bảo trì: Thấp. Agent tự thích nghi với những thay đổi của UI mà không cần viết lại một dòng code nào.
- Độ phức tạp: Nó xử lý các suy luận đa bước và tắt các modal (cửa sổ bật lên) một cách trực quan.
Sự đánh đổi: Khi nào nên sử dụng AI Agent
AI agent rất mạnh mẽ, nhưng không phải lúc nào cũng là lựa chọn đúng đắn. Bạn phải cân nhắc giữa trí thông minh và chi phí vận hành.
Ưu điểm
- Khả năng phục hồi: Nếu một trang web chuyển nút đăng nhập sang một góc khác, AI vẫn sẽ tìm thấy nó.
- Ngôn ngữ tự nhiên: Bạn có thể xác định các kịch bản kiểm thử bằng tiếng Việt hoặc tiếng Anh thông thường. Điều này cho phép các product manager hoặc QA lead viết script tự động hóa mà không cần kiến thức lập trình sâu.
- Suy luận hình ảnh: Các LLM hiện đại cực kỳ giỏi trong việc xác định các mẫu UI phức tạp mà thông thường sẽ gây khó khăn cho các script truyền thống.
Nhược điểm
- Chi phí: Mỗi hành động đều tiêu tốn token. Một lần chạy phức tạp có thể tốn từ 0,05 USD đến 0,20 USD tùy thuộc vào mô hình và số bước thực hiện.
- Độ trễ: Quá trình suy luận của LLM cần có thời gian. Một script Playwright có thể thực hiện một cú nhấp chuột trong 50ms, trong khi một AI agent có thể mất 10–20 giây để “suy nghĩ” trước khi hành động.
- Tính không xác định: Agent đôi khi có thể đi theo một con đường khác để đạt cùng một kết quả, khiến việc debug nghiêm ngặt trở nên phức tạp hơn một chút.
Thiết lập đề xuất
Để có kết quả tốt nhất, tôi khuyên bạn nên sử dụng Claude 3.5 Sonnet. Mặc dù GPT-4o có khả năng tương đương, nhưng Claude hiện đang dẫn đầu về suy luận không gian. Nó tốt hơn đáng kể trong việc nhấp vào đúng tọa độ trên màn hình.
Điều kiện tiên quyết
- Python 3.11 trở lên.
- Một API key từ Anthropic hoặc OpenAI.
- Playwright đã được cài đặt trên hệ thống của bạn.
Cài đặt
Bắt đầu bằng cách tạo một môi trường ảo. Sau đó, cài đặt thư viện browser-use và tích hợp LangChain cho LLM bạn chọn.
pip install browser-use langchain-anthropic playwright
playwright install chromiumHướng dẫn triển khai: Xây dựng Agent đầu tiên của bạn
Hãy cùng xây dựng một script thực tế. Chúng ta muốn agent điều hướng đến một trang web trực tiếp, tìm kiếm một sản phẩm và trích xuất một mức giá cụ thể. Nhiệm vụ này kiểm tra khả năng điều hướng, lọc kết quả và phân tích dữ liệu đồng thời của agent.
1. Cấu hình môi trường
Lưu trữ API key của bạn trong một biến môi trường. Điều này giúp giữ an toàn cho thông tin xác thực của bạn và tránh đưa chúng vào các file mã nguồn.
export ANTHROPIC_API_KEY="your-api-key-here"2. Script cho Agent
Cách triển khai này ngắn gọn đến ngạc nhiên. Chúng ta khởi tạo mô hình và chuyển trực tiếp một nhiệm vụ bằng ngôn ngữ tự nhiên cho agent.
import asyncio
from browser_use import Agent
from langchain_anthropic import ChatAnthropic
async def main():
# Sử dụng temperature 0 để các hành động nhất quán và có thể tái lập
llm = ChatAnthropic(model="claude-3-5-sonnet-20240620", temperature=0)
task = "Truy cập ebay.com, tìm kiếm 'RTX 4090' và tìm giá của danh sách đầu tiên không được tài trợ."
agent = Agent(
task=task,
llm=llm,
)
result = await agent.run()
print(f"Kết quả của Agent: {result}")
if __name__ == "__main__":
asyncio.run(main())3. Thêm công cụ tùy chỉnh với Controller
Các quy trình làm việc của doanh nghiệp thường yêu cầu agent làm nhiều việc hơn là chỉ duyệt web. Bạn có thể cần nó lưu dữ liệu vào cơ sở dữ liệu hoặc gửi thông báo đến kênh Slack. Lớp Controller cho phép bạn mở rộng khả năng của agent bằng các hàm Python tùy chỉnh.
from browser_use import Agent, Controller
controller = Controller()
@controller.action('Lưu dữ liệu vào file cục bộ')
def save_to_file(content: str):
with open('output.txt', 'a') as f:
f.write(content + '\n')
return 'Thành công'
agent = Agent(task="Tóm tắt tin tức AI và lưu vào một file", llm=llm, controller=controller)Lời khuyên thực tế từ kinh nghiệm thực chiến
Việc vận hành các agent này trong môi trường production đã dạy cho tôi một vài bài học xương máu về độ tin cậy và kiểm soát chi phí.
Thiết lập giới hạn tối đa cho các bước
Agent đôi khi có thể bị kẹt trong một vòng lặp nếu chúng gặp phải một giao diện người dùng gây khó hiểu. Luôn thiết lập tham số max_steps. Đối với hầu hết các tác vụ web, 20 bước là đủ. Nếu agent không thể hoàn thành sau ngần ấy bước, có khả năng prompt của bạn quá mơ hồ.
Quan sát Agent làm việc
Khi bạn đang debug, hãy đặt headless=False. Việc quan sát AI di chuyển con trỏ, cuộn qua các trang và tạm dừng để “đọc” nội dung là cực kỳ hữu ích để khắc phục các lỗi logic. Chỉ chuyển lại thành headless=True khi script đã ổn định.
Viết Prompt thật rõ ràng
Cấu trúc của prompt rất quan trọng. Thay vì nói “Lấy dữ liệu”, hãy thử: “Trích xuất tên sản phẩm, giá hiện tại và phí vận chuyển. Trả về kết quả dưới dạng đối tượng JSON”. Sự cụ thể giúp giảm số bước suy luận và tiết kiệm chi phí token cho bạn.
Kết luận
Chuyển từ thao tác DOM thủ công sang các agent điều khiển bằng AI là một bước tiến lớn về hiệu suất cho DevOps hiện đại. Các công cụ truyền thống như Playwright vẫn chiếm ưu thế trong các tác vụ lặp đi lặp lại tốc độ cao trên các dashboard nội bộ. Tuy nhiên, Browser Use là người chiến thắng rõ rệt khi xử lý tính chất khó lường và lộn xộn của web công cộng.
Hãy bắt đầu từ những việc nhỏ. Xác định một tác vụ thủ công bạn thực hiện mỗi sáng—như kiểm tra một dashboard phân tích cụ thể—và tự động hóa nó bằng script được cung cấp. Một khi bạn thấy agent vượt qua thành công một pop-up ngẫu nhiên, bạn sẽ hiểu tại sao duyệt web ngữ nghĩa là tương lai của tự động hóa web.
