让AI住进网页里：Page Agent 纯前端自动化初探

最近发现阿里云开源的 Page Agent 挺有意思，跟大家分享一下我的使用感受。

PageAgent简介

PageAgent 是一款由阿里巴巴开源的、基于 JavaScript 的 GUI 智能体（GUI Agent）。它最大的亮点在于无需依赖浏览器插件、Python 环境或无头浏览器，仅通过在页面中注入 JavaScript 即可运行。

它允许用户通过自然语言控制网页界面，将复杂的操作流程转化为简单的指令，非常适合用于 SaaS 产品的 AI 助手集成或个人网页自动化任务。

开源仓库：https://github.com/alibaba/page-agent

核心特性概览

两种接入与使用方式

网站所有者：嵌入式 AI 助手

如果你是网站开发者，希望为你的用户提供“AI 操控”能力，只需在网页源码中引入一行 JS 代码即可。

实现原理：

快速接入代码：

<script src="https://registry.npmmirror.com/page-agent/1.6.3/files/dist/iife/page-agent.demo.js"></script>

效果： 网站上会出现一个聊天框，用户可以通过文字沟通来自动化处理一些简单任务，无需后端重写。

体验地址： https://cooking.youhun.wang/

个人用户：浏览器插件扩展

如果你不是网站所有者，但希望在日常浏览中使用自动化功能（如在非自家的网站上执行复杂任务），可以使用其提供的 Chrome 扩展程序。

使用方法：

1. 安装官方提供的 Chrome 扩展：https://alibaba.github.io/page-agent/docs/features/chrome-extension/。
2. 扩展会注入 Agent 脚本到当前页面。
3. 用户可以通过扩展面板发送指令，控制当前标签页。

适用场景： 适合完成跨页面任务或对第三方网站进行稍微复杂的自动化操作。

实际体验：有亮点也有槽点

在实际体验中，PageAgent 的表现符合预期，但也存在一定的局限性：

优点：

• 轻量级： 无需复杂的环境配置，纯 JS 运行，加载速度快。
• 低成本： 相比于 Puppeteer 或 Selenium，它直接在页面上下文中运行，资源消耗更低。
• 易上手： 开发者集成非常简单，几行代码即可拥有 AI Copilot 能力。

局限性（体验反馈）：

• DOM 依赖性强： 它的识别逻辑完全依赖于 DOM 模型。如果网页元素缺乏语义化标签（如没有 aria-label 或文本内容），Agent 往往会“视而不见”，导致无法点击或输入。
• 简单任务为主： 目前更适合处理逻辑简单的线性任务（如填写表单、点击导航）。对于逻辑极其复杂或动态加载极快的 SPA 应用，可能会出现识别滞后或找不到元素的情况。
• 体验一般： 在一些非标准布局的网站上，交互体验可能不如原生插件流畅。

总结与建议

Page Agent 是一个挺有想法的项目，把 AI Agent 从“外部操控浏览器”变成了“内部嵌入网页”，架构轻量、接入成本低。但目前在实际使用中，DOM 识别的准确率还有提升空间，复杂任务容易翻车。

不过话说回来，这种纯前端实现 GUI Agent 的思路确实值得学习。如果你对 AI 自动化或者浏览器扩展开发感兴趣，去 GitHub 上看看源码应该能有不少收获。