想象一下，你打开公司那套用了八年的老旧后台系统。密密麻麻的表单，十几个下拉框，找一个字段能找到眼花。
你不想点了。你打了一行字：「帮我提交一张50块钱的午餐报销，昨天的。」
回车。
页面自己动了起来。光标自己跳到姓名框，自己填公司字段，自己选套餐档位，自己点了保存。全程你的手没碰键盘之外的任何东西。
这既非科幻片桥段，也非哪个大厂关起门来内测的黑科技。它是阿里巴巴上个月悄悄开源、这周突然在全球开发者圈子里疯传的项目，PageAgent。
一行代码，GitHub两万多人给它点星
事情要从一段极短的代码说起。
<script src="https://cdn.jsdelivr.net/npm/page-agent@1.11.0/dist/iife/page-agent.demo.js" crossorigin="true"></script>
把这行代码贴进任意网页的 <script> 标签，或者用 npm 装个包，几行配置，一个网站，就此拥有了自己的「AI操作员」。用户不再需要学着用你的系统，只需要说人话。
阿里巴巴的官方 Demo 页上，这句话被印得很大：
"One line of code, turns your website into an AI-native app. Users give natural language commands, AI handles the rest."
「一行代码，让你的网站变成AI原生应用。用户用自然语言下命令，剩下的交给AI。」
▲ alibaba.github.io/page-agent 官方Demo首页，输入框里打字就能测试，右上角标着当前 star 数。
这套东西真正在中文互联网炸开，得倒回6月22日这一天。X（推特）博主 @gaoqian2580 发了一条帖子：
「阿里开源 Page-Agent 爆火！GitHub 狂揽 18.7K star！用自然语言就能指挥它点击按钮、填写表单、完成复杂操作。无需浏览器模拟、无截图、无OCR，纯前端 Agent 独立上阵，丝滑好用！」
这条帖子拿下516个赞、883次收藏，评论区涌进一堆同行追问「这靠谱吗」「生产环境能用吗」。
▲ @gaoqian2580 在6月22日发布的爆款推文，配图为当时18.7k stars的GitHub仓库主页。
十天后，7月2日，AI垂直媒体 Marktechpost 发了一篇深度分析文章，标题开门见山：《Meet Alibaba's Page Agent: A JavaScript In-Page GUI Agent That Controls Web Interfaces With Natural Language Through the DOM》。这篇文章又在X上被官方账号转发，配上实录视频，进一步把话题带向全球开发者。到7月3日，GitHub星标已经冲到22.3k，而且还在涨。
▲ 截至发稿前，alibaba/page-agent 仓库星标22.3k，34位贡献者，最新版本v1.11.0。
反过来了：以前是外面的机器人在敲键盘，现在是网页自己会动手
要理解PageAgent为什么让开发者这么兴奋，得先明白一件事：过去所有能「替你操作网页」的工具，走的都是同一条路，从外面控制。
Selenium、Playwright、Puppeteer，这些经典的浏览器自动化工具，都要单独起一个进程，拉起一个（通常是无头的）浏览器，靠WebDriver或者Chrome DevTools协议远程操控。更前沿一点的browser-use之类的智能体，干脆把网页截图丢给多模态大模型，让AI「看图猜哪里能点」。
这条路径注定又贵又慢。截图要传输，多模态模型token费用高，识别还可能猜错位置。更麻烦的是，你的登录状态、会话信息，这些外部机器人统统没有，得单独想办法处理认证。
Marktechpost的文章这样形容这种反差：
"Most browser automation runs from the outside... Alibaba's Page Agent takes the opposite path. The agent lives inside the webpage as plain JavaScript. It reads the live DOM as text and acts as the real user. No headless browser, no screenshots, no multi-modal model."
「大多数浏览器自动化都是从外部运行的……阿里的Page Agent走了相反的路径。这个智能体就活在网页内部，是一段纯粹的JavaScript。它把实时DOM读成文字，像真实用户一样操作。不需要无头浏览器，不需要截图，不需要多模态模型。」
这句「活在网页里」是理解整件事的钥匙。PageAgent算不上一个外挂的机器人，它本身就是网页的一部分，用户已经登录了，它照样能用这份会话；页面结构变了，它能实时重新扫描；不用另起后端，也不用重写任何东西。
Marktechpost还画了张对比表，把PageAgent和三类老牌选手摆在一起：
| | | | |
|---|
| | | | |
| Selenium/Playwright/Puppeteer | | | | |
| | | | |
| | | | |
这里的差别落在使用场景上：PageAgent专攻你自己能改代码的产品；外部驱动的工具，依然是爬取跨站数据、伺候被锁死系统的主力，各管一段。
「脱水」黑箱：网页怎么变成AI能看懂的文字
那PageAgent到底怎么让一个普通文本模型精准点中按钮的？答案藏在一个词里，DOM dehydration（DOM脱水）。
一个现代网页的DOM树，动辄几千个节点。要是把原始HTML整个丢给大模型，又慢又贵，模型还容易迷失在一堆无意义的标签属性里。
PageAgent的做法是：指令一到，先扫描整个DOM，把所有「可交互元素」，按钮、输入框、链接，一个个挑出来，给每个元素分配一个编号，再标上它的角色和文字说明。冗余的标签属性被剥离干净，最后生成一份叫FlatDomTree的纯文本地图。模型读的是这份精简文本，跳过像素，也绕开原始HTML。
拿到模型返回的带编号动作指令后，真正干活的是另一个模块，PageController。文档里给出的核心调用是这样的：
await this.pageController.updateTree()
await this.pageController.clickElement(index)
await this.pageController.inputText(index, text)
await this.pageController.scroll({ down: true, numPages: 1 })
它模拟的是真实用户事件，真的点击、真的输入、真的滚动，绝不会绕开界面偷偷改数据。整个项目拆成monorepo里的几个包：@page-agent/core管核心决策逻辑，page-agent是带UI面板的入口，@page-agent/page-controller专门负责DOM提取和索引，还带一个叫SimulatorMask的可视化反馈层，能让你亲眼看到AI「点了哪里」。
这套设计换来的好处摆在明面上：强文本模型就够用了，不需要为多模态识别的高昂账单买单；延迟更低，因为不用截图往返；精度也更高，靠的是结构化信息，而非视觉「猜」出来的坐标。
官方文档的功能页上，四个特性被摆在最显眼的位置，「Smart DOM Analysis（智能DOM分析）」、「Secure & Controllable（安全可控）」、「Zero Backend（零后端）」、「Accessible Intelligence（无障碍智能）」。
▲ 官方文档Overview页，把Smart DOM Analysis、Secure & Controllable、Zero Backend、Accessible Intelligence四个特性放在首屏。
三个月前那场吵架：安全问题，作者亲自下场接招
技术亮点讲完了，该说说争议了。
PageAgent算不上这两天才冒出来的新项目，它三个月前就在Hacker News发过Show HN帖子，拿到147个赞、76条评论，作者本人simon_luv_pho（在阿里工作，X账号@simonluvramen）几乎是逐条回复的架势，把这个项目的技术辩论摆到了台面上。
他在发帖里说：
"I built this because I believe there's a massive design space for deploying general agents natively inside the web apps we already use, rather than treating the web merely as a dumb target for isolated bots."
「我做这个项目，是因为我相信，把通用智能体原生部署进我们已经在用的网页应用里，这里面有巨大的设计空间，而不该只是把网页当成孤立机器人操作的一个笨目标。」
评论区最尖锐的问题，几乎都指向同一个方向：一段能替用户点鼠标、填表单的JS脚本，挂在网页里，安全边界在哪？
有网友当场质疑客户端智能体的权限风险。作者的回应也很坦率，大意是：PageAgent在HTML/DOM层面运行，权限和任何其它第三方脚本完全一样，这种「安全令牌」担忧，本来就适用于每一段被你放进页面的第三方代码，并非PageAgent独有的新风险。
还有人提到企业站点常见的CSP（内容安全策略），常常挡掉内联脚本，导致集成失败；也有人指出DOM脱水这一步的还原精度，才是真正容易出边界问题的地方，序列化越保真，AI判断越准。
▲ Hacker News Show HN原帖，147分76条评论，作者本人在评论区逐条回应安全、CSP与扩展权限的质疑。
面对这些拷问，PageAgent交出的答案落在层层设防上，而非一句简单的「相信AI」：操作白名单限制智能体能做什么；敏感字段（比如密码）在传给模型之前先打码，模型压根看不到明文；关键操作执行前，弹窗等用户手动批准；开发者还可以往里注入自定义规则，让智能体按你的业务逻辑走。
这套护栏思路，恰恰是这个项目最值得记一笔的地方，没有指望模型自己足够聪明、足够谨慎。再强的大模型也会看错字段、点错按钮，真正兜底的，是这些写死的规则，不靠一句「模型应该不会犯错」的信念。
从中国刷屏到全球开发者圈：「几乎没人注意到，但这太疯狂了」
7月初这一波关注，不只在中文圈。
美国开发者@DivyanshT91162在X上写道：
"CHINA just dropped what could be the future of web apps... This isn't another flashy demo. It's production-ready."
「中国刚刚发布了可能是网页应用未来的东西……这并非又一个花哨的演示，它是真正能用于生产环境的东西。」
SaaS领域的独立开发者@karlarboledas的说法更犀利：
"this is insane. alibaba just dropped an open-source tool called PageAgent, and almost no one in the SaaS world is paying attention yet... if you're a founder manually coding AI features or copilots from scratch, this completely changes the game."
「这太疯狂了。阿里刚刚开源了一个叫PageAgent的工具，而SaaS世界里几乎没人注意到……如果你是那种手动给产品逐个开发AI功能或Copilot的创始人，这东西彻底改变了游戏规则。」
▲ SaaS独立开发者@karlarboledas的推文，列出零摩擦集成、语音控制、多页支持等亮点，附带官方演示界面截图。
这类反应背后，是同一个判断在被反复验证：对大量做后台系统、ERP、CRM，却没资源重写前端、更没精力搭一套完整智能体服务的团队来说，PageAgent把「给产品加个AI操作员」这件事，从一个工程项目压缩成了一次配置。客服机器人不再只会说「请点击设置按钮」，它能替用户把操作一步做完；做了十几年没人愿意碰的老旧内部工具，不改一行原有代码，也能加上一条自然语言指令栏；配合语音API，原本操作复杂的网页，对视障用户或者操作不便的用户，也第一次变得可以「说句话就能用」。
当然，清醒的声音也在。质疑者提到最多的，是客户端把API密钥明晃晃暴露出来的风险，生产环境这么干，等于把钥匙挂在自家大门外面，官方文档也明确建议用后端代理转发，别让密钥进浏览器裸奔。复杂到会在每次状态变化时把整棵DOM树推倒重建的动态页面（比如重度使用React的应用），脱水的稳定性也还需要观察。这东西目前擅长的，是结构清晰、语义良好的页面，遇上大量canvas绘制或者故意设置的视觉验证码，它一样束手无策，系统提示会主动跳过，把操作交还给真人。
AI从「说」到「做」，又往前跨了一大步
把这些线索拼在一起看，会发现PageAgent真正撬动的，不只是一个开源库的走红。
过去两年，大模型能聊、能写、能画，但「让AI真正替你操作一个具体的软件界面」，始终隔着一层，要么得自己搭一套笨重的浏览器自动化管道，要么得为视觉模型的账单发愁。PageAgent把这层隔阂，压缩成了一行<script>标签。
这也在给前端开发者提一个新要求：未来设计一个界面，可能不只要考虑人怎么看懂它，还要考虑AI智能体能不能顺利读懂它的结构，语义清晰的HTML、稳定的元素标识，会变成一种新的「基础设施素养」。
当然，这场变革里没有魔法。护栏能挡住大部分意外，却挡不住所有；文本模型再精准，遇到语义混乱的页面照样会判断失误；客户端的每一段代码，都和这个项目本身一样，权限和风险摆在明面上，需要开发者自己负责任地用。
但至少，那道曾经横在「AI能聊」和「AI能干」之间的墙，已经被撬开了一道口子。22.3k颗星标，还在继续往上涨。
10个月宝宝每天需要喝多少奶粉？
