阿里巴巴 PageAgent 深度评测:改变网页自动化的页面内嵌式 GUI Agent

阿里巴巴 PageAgent 深度评测:改变网页自动化的页面内嵌式 GUI Agent

今天我们来深入分析阿里巴巴开源的 page-agent—一款发布后即获得 8,600+ GitHub Star 的 JavaScript 页面内嵌 GUI Agent。它不仅仅是一个浏览器自动化工具,更是用自然语言控制网页界面的全新范式。

它有什么特别之处?

PageAgent 通过简单的 <script> 标签将 AI Agent 直接嵌入到任何网页中。与 Playwright、Puppeteer 等从外部控制浏览器实例的工具不同,pageAgent 运行在用户的浏览器会话中—它看到用户看到的 DOM,用用户已有的权限执行操作。

六维质量评估

评估维度得分权重核心亮点
结构完整性9.015%7个包的TypeScript monorepo,文档完善,Demo/Chrome扩展/MCP全配齐
指令清晰度8.520%README清晰,文档完整,中英双语,开发者指南详尽
实用性9.525%极简集成(一行script标签),继承用户会话,无需后端改造
可复现性8.510%基于DOM文本操作,确定性强于截图方案
专业深度8.520%Observe-Think-Act闭环,DOM简化提取,支持Ollama离线部署
差异化9.510%业界唯一纯客户端内嵌方案vs外部自动化框架

总分:8.93/10 — S级 ★★★★★

架构创新

其他主流网页自动化方案都在浏览器外部运行:

传统方案: Playwright/Puppeteer → 外部浏览器实例 → 需credential管理
page-agent → <script>标签内嵌 → 继承用户已登录会话 → 无需cookie同步

这是根本性差异:无需重新登录、无需同步cookie、无需维护TLS代理。

Observe–Think–Act 闭环

  1. Observe(观察):PageController 提取 DOM 状态,转换为带索引交互元素的简化HTML
  2. Think(思考):文本表示传递给 LLM,模型推理下一步操作
  3. Act(执行):选中工具执行合成 DOM 操作(点击、填写、滚动)

每步都发起新的 LLM 调用并携带更新后的页面状态,使系统能对动态变化做出响应。

极简集成示例

<script src="https://cdn.jsdelivr.net/npm/page-agent@1.7.1/dist/iife/page-agent.demo.js"></script>

就这一行。或者使用 npm:

import { PageAgent } from 'page-agent';

const agent = new PageAgent({
  model: 'qwen3.5-plus',
  baseURL: 'https://dashscope.aliyuncs.com/compatible-mode/v1',
  apiKey: 'YOUR_API_KEY',
});

await agent.execute('找到优先级最高的未处理工单并分配给Alice');

多LLM提供商支持

提供商状态
OpenAI (GPT-4o, o3)✅ 原生支持
阿里 Qwen✅ Dashscope
Anthropic Claude✅ 兼容patch
DeepSeek
Google Gemini
Ollama (本地)✅ 离线部署

Ollama 支持尤其重要:满足数据主权要求的离线部署成为可能。

与竞品对比

维度page-agentPlaywrightBrowser-UseStagehand
部署方式页面内嵌JS外部Node.js外部Python外部Node.js
会话认证继承浏览器手动管理手动管理手动管理
接口方式DOM文本WebDriverDOM+截图DOM+截图
视觉依赖可选可选
多标签需扩展原生原生原生
GitHub Stars8.6k67k21k8k
最佳场景站内CopilotCI/CD测试研究型Agent精准操作

适用场景

场景推荐度说明
企业内嵌Copilot⭐⭐⭐⭐⭐继承SSO会话,12行代码改造ERP/CRM
SaaS产品AI增强⭐⭐⭐⭐⭐无后端改造,一行script加Copilot
数据抓取/自动化⭐⭐⭐需处理反爬场景
无障碍访问增强⭐⭐⭐⭐自然语言控制,屏幕阅读器兼容
离线/安全敏感环境⭐⭐⭐⭐Ollama支持,数据不出本地

安全考量

PageAgent 包含多项安全特性:

  • allowList:限制可执行操作(click/fill/scroll)
  • dataMask:敏感字段脱敏(密码、信用卡)后传给LLM
  • Human-in-the-loop:可视化思考面板,执行前展示推理过程

⚠️ 间接提示注入风险:恶意网页内容可能诱导Agent执行非预期操作。缓解措施:使用allowList限制,高风险流程启用人工确认。

能力边界

  • ❌ 无法解决CAPTCHA
  • ❌ 无法处理纯图片内容
  • ❌ 某些contenteditable元素支持有限(如Twitter编辑器)

总结

S级评分 8.93分 — 这是目前最轻量的网页AI控制方案

它的意义不在于技术突破(DOM+LLM是已知模式),而在于部署模型:把AI Agent从需要后端基础设施的"项目"变成前端的"npm包"。

"每个Web应用都能拥有AI层" — 这是page-agent带来的范式转变。


发表于 SkillsAgent 博客。在 skillsagent.org 发现此技能

Subscribe to skills for your Agent

Don’t miss out on the latest issues. Sign up now to get access to the library of members-only issues.
张伟@示例.com
订阅