我解放啦，网页终于能自己干活了！阿里 2 万 Star 开源 Page Agent，20 次点击变一句话

嗨，我是小华同学，专注解锁高效工作与前沿AI工具！每日精选开源技术、实战技巧，助你省时50%、领先他人一步。👉免费订阅，与10万+技术人共享升级秘籍！

我解放啦，网页终于能自己干活了！阿里 2 万 Star 开源 Page Agent，20 次点击变一句话

先说结论：

Page Agent 最值得看的地方，不是“AI 能点按钮”，而是它把 Agent 直接放进网页里。

如果你做过后台系统、SaaS、CRM、ERP 或管理平台，就会知道：真正劝退用户的，往往不是功能少，而是按钮太多、路径太深、流程太绕。

这篇文章不做源码长拆，只用 3 分钟讲清楚：它为什么火、和传统浏览器自动化有什么不同、以及你自己的产品能不能借这个思路做 AI Copilot。

Page Agent Banner

官方还放了一个 Demo 视频，想先看效果的可以打开：

https://github.com/user-attachments/assets/a1f2eae2-13fb-4aae-98cf-a3fc1620a6c2

卡通趣味创作图：网页里的 AI 小助手

你有没有发现，现在很多 AI Agent 都在“控制浏览器”：

用截图识别页面，用 Playwright 点按钮，或者让一个外部自动化程序远程操作网页。

但阿里开源的 Page Agent 换了一个思路：

不是让 AI 从外面操控浏览器，而是让 Agent 直接住进你的网页里。

Page Agent 定位对比

上面这张图，就是这篇文章最核心的反差：

传统浏览器自动化更像“外部脚本控制页面”，Page Agent 更像“网页自己长出一个 AI 操作员”。

截至 2026-06-27，我查到这个项目已经有 20.2k+ Star、1.7k+ Fork，MIT 协议，主语言是 TypeScript，最新版本是 v1.10.0。

一句话概括：

Page Agent 是一个运行在网页里的 GUI Agent，可以让用户用自然语言控制 Web 页面。

比如你对后台说：

“帮我把今天新增的客户筛出来，导出销售线索。”

它要做的事情不是回复一段操作教程，而是直接理解页面、点击按钮、填写表单、切换选项，把流程跑起来。

30 秒看懂它

Page Agent 执行流程

最吸引我的地方，不是“它能点按钮”。

真正有价值的是：它把网页从“只能被人操作的界面”，变成了“可以被 AI 理解和执行的工作台”。

它和传统浏览器自动化有什么不一样？

很多人一听“AI 操作网页”，第一反应是：

Playwright？Selenium？browser-use？浏览器扩展？

这些当然都很强，但 Page Agent 的定位不完全一样。

简单说：

它更像是给你的 Web 产品加一个“内置 AI 操作员”，而不是写一个外部机器人。

这对 B 端系统尤其有想象力。

ERP、CRM、管理后台、数据平台、客服后台，很多产品不是功能不够，而是路径太深、表单太多、操作太绕。

如果用户能直接说目标，系统自己完成一串点击和填写，这就是非常典型的 AI Copilot 场景。

它主要能做什么？

Page Agent 官方给的几个应用场景，我觉得都挺实用：

它的核心特点也比较明确：

• 轻集成：无需 Python、无头浏览器，页面里引入 JS 即可。
• 文本 DOM 操作：不截图，不依赖多模态模型。
• 自备 LLM：可以接 OpenAI-compatible API、Ollama 等模型服务。
• 可扩展：有 Chrome 扩展，也有 Beta 版 MCP Server。

怎么接入？

最简单的体验方式，是直接用 CDN：

<script src="{URL}" crossorigin="true"></script>

如果在项目里使用，可以通过 npm：

npm install page-agent

然后初始化一个 Agent：

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',
    language: 'zh-CN',
})

await agent.execute('点击登录按钮')

官方也提醒了：免费 Demo LLM 仅用于技术评估，长期使用建议配置自己的模型服务。

但它不是万能的

这点一定要说清楚，不然很容易把它理解成“网页自动化银弹”。

Page Agent 是基于 DOM 理解页面的，所以它更适合语义化较好的 Web 应用。

它目前更擅长：

• 点击
• 文本输入
• 下拉选择
• 表单提交
• 页面滚动
• 单层同源 iframe
• 可选执行 JavaScript

但它不适合这类场景：

• 复杂拖拽
• 右键菜单
• 纯视觉识别
• Canvas / WebGL / 图片内容理解
• 跨域 iframe
• Monaco、CodeMirror 这类复杂编辑器的细粒度操作

所以我的判断是：

它不是替代所有浏览器自动化工具，而是给“你自己控制的 Web 产品”增加 AI 操作能力。

这个定位反而更清晰，也更适合落地。

为什么值得关注？

我觉得 Page Agent 值得技术人关注，原因有三个。

第一，它站在了一个非常热的方向上：AI Agent + 浏览器操作 + MCP + SaaS Copilot。

第二，它选了一个很巧的切入点：不从外部控制浏览器，而是让 Web 应用自己拥有 Agent 能力。

第三，它已经不是概念项目：GitHub 2 万 Star、npm 版本到 1.10.0、文档里有扩展、MCP、数据脱敏、自定义工具等工程化能力。

如果你正在做后台系统、低代码平台、CRM、ERP、数据分析平台，或者想给自己的产品加一个 AI 操作入口，这个项目非常值得看看。

最后

以前我们总说：

AI 会帮用户看懂页面。

但 Page Agent 给我的感觉是：

下一步，网页本身就要开始听懂人话了。

这才是它真正有意思的地方。

后面我准备继续拆它的源码结构，包括 DOM 是怎么“脱水”给 LLM 的、Page Agent 和 browser-use 的关系、MCP Server 怎么接本地 Agent。感兴趣的话，可以先收藏这篇。

项目地址

• GitHub：https://github.com/alibaba/page-agent
• Demo：https://alibaba.github.io/page-agent/
• 文档：https://alibaba.github.io/page-agent/docs/introduction/overview
• HN 讨论：https://news.ycombinator.com/item?id=47264138