网页自带 AI 助手:Page Agent 一行脚本,让任何人都能用自然语言操作你的产品

最近发现阿里开源了一个挺有意思的项目——不是又一款浏览器自动化工具，而是把 AI 直接嵌进网页里。

Page Agent

这玩意叫 Page Agent，27.8k ⭐，MIT 开源。它的核心思路很简单：在你网页里塞一行 <script> 标签，页面就自带了一个 AI Agent，用户对着它说人话就能操作界面——点按钮、填表单、搜内容，全搞定。

跟浏览器自动化工具最大的区别：那些是从外部操控浏览器（Python + Playwright / Puppeteer），Page Agent 是活在页面内部的 JavaScript——不需要浏览器扩展、不需要 Python 环境、不需要截屏给多模态模型看。它对 DOM 做文本级别的理解和操作，轻量、快速，主流 LLM 都能接。

三个让人眼前一亮的能力：

• SaaS 产品秒变 AI Copilot。如果你在做一个 SaaS，只需要引入一行脚本，用户就能用自然语言在界面上完成操作。"帮我把这个表格里所有金额超过 1000 的行标红"——Page Agent 自己去找对应的 DOM 节点然后动手。
• 填表不再点点点。ERP、CRM、后台管理系统里那种 20 步的填表流程，用户一句话就搞定。表单越复杂，优势越明显。
• 无障碍访问。对视力障碍用户来说，屏幕阅读器能读但不能操作——Page Agent 可以，用户说"帮我把购物车里的第二件商品删掉"，Agent 直接执行。

怎么装

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

丢进 HTML 里就行，自带一个免费的演示用 LLM 后端，开箱即用。想用自己的模型也很简单：

npm install page-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',})await agent.execute('Click the login button')

支持所有 OpenAI 兼容接口的模型，本地部署的也行。

怎么用

引入后页面右下角会出一个悬浮按钮，点开就是对话框。

用户直接输入自然语言指令，Agent 会自动解析页面 DOM，找到对应元素然后操作。比如在一个数据后台里说"导出最近 7 天的订单报表"，Agent 会自己去找到日期筛选器、点导出按钮、选 CSV 格式。

如果想跨页面操作（比如在页面 A 填完表单后自动跳到页面 B 继续），可以装它的 Chrome 扩展，给了 Agent 跨标签页的能力。还有一个 MCP Server（beta），让外部的 Agent 客户端也能操控你的浏览器。

⚠️ 注意事项

免费演示 API 仅供技术评估，别拿来做生产用途——有调用频率限制，而且数据会经过 Page Agent 的测试服务器。生产环境配自己的 LLM API。

Chrome 扩展和 MCP Server 目前都是可选功能，核心的页面内 Agent 不依赖它们，一行脚本就能跑。

能派上用场的地方

• SaaS 产品加 AI Copilot，不需要重写后端
• 企业后台系统，让非技术用户用自然语言查询和操作
• 无障碍改造，语音指令替代点按操作
• 内部工具快速原型，给运营/客服用的管理面板一句话就能操作

总结

Page Agent 踩准了一个很巧妙的位置：它不跟 browser-use（106k ⭐）这类外部自动化工具抢地盘，而是做页面内的 AI 增强——让你的产品自己长出 AI 操作能力，而不是让 AI 从外面爬进来。对于做 SaaS 或者有 Web 产品的团队来说，一行脚本就能给用户一个 AI Copilot，这个接入成本低到几乎没有门槛。

同类工具

browser-use

106k ⭐，MIT。Python 生态里的浏览器自动化标杆，用 Playwright 从外部操控浏览器，配合 LLM 完成网页任务。Page Agent 的 DOM 处理逻辑就是从 browser-use 衍生过来的。区别在于：browser-use 是你写 Python 脚本操控别人的网页，Page Agent 是你把 AI 嵌进自己的网页让别人用。

stagehand

23.6k ⭐，MIT，由 Browserbase 维护。定位是"浏览器 Agent 的 SDK"——给开发者一套 API 来构建能从外部操控网页的 Agent。同样是外部控制模式，适合做数据抓取、自动化测试，不适合给自家产品加 AI Copilot。

❝

三者的区别：Page Agent 是唯一一个活在页面内部的方案，一行 script 标签就能让网页自带 AI 操作能力。browser-use 和 stagehand 都是从外部操控浏览器，适合自动化抓取和测试，但不是给终端用户用的。

相关资源

• 📦 alibaba/page-agent：https://github.com/alibaba/page-agent
• 📖 官方文档：https://alibaba.github.io/page-agent/docs/introduction/overview
• 🔌 npm 包：https://www.npmjs.com/package/page-agent
• 🎬 在线 Demo：https://alibaba.github.io/page-agent/

💡 点个关注，带你一起围观最前沿的 Agent 工具生态！