简介Page Agent 是由阿里巴巴开源的一款纯前端 GUI 智能体框架其核心理念是“The GUI Agent Living in Your Webpage”。它颠覆了传统 Web 自动化需要依赖后端服务、无头浏览器或浏览器插件的模式直接将 AI 智能体嵌入到网页中运行。用户通过自然语言指令如“点击登录按钮”、“填写表单并提交”即可控制网页界面完成复杂操作。该项目采用 MIT 协议开源旨在为 SaaS 产品、后台系统提供零基建、一行代码即可集成的 AI Copilot 能力。主要功能自然语言控制界面用户使用自然语言描述任务Agent 自动解析并执行点击、输入、选择、滚动等 DOM 操作。纯前端架构无需 Python、无头浏览器或后端服务直接在浏览器 JavaScript 环境中运行数据不离开用户端。文本化 DOM 操作摒弃了依赖截图和多模态模型的传统方案通过解析和清理 DOM 结构发送给 LLM速度快、成本低、精度高。Human-in-the-Loop提供可视化操作面板展示 Agent 的思考过程遇到歧义时主动询问用户确认支持人工干预。多模型支持支持 OpenAI、Claude、通义千问、Gemini 等任何兼容 OpenAI API 格式的模型采用 BYOKBring Your Own Key模式。跨页面扩展提供可选的 Chrome 浏览器扩展WIP支持跨多个标签页的复杂工作流自动化。安装与配置方式一CDN 快速体验Demo在 HTML 中引入 Demo 脚本含免费测试 API仅限评估script srchttps://cdn.jsdelivr.net/npm/page-agent1.5.11/dist/iife/page-agent.demo.js crossorigintrue/script方式二NPM 安装生产环境通过 npm 安装包并自行配置 LLM APInpm install page-agent配置参数初始化 PageAgent 实例时需配置 LLM 连接参数model使用的模型名称如qwen3.5-plus。baseURLLLM API 的基础地址如 OpenAI 或 DashScope 端点。apiKey你的 API 密钥。language界面语言如zh-CN。如何使用初始化在页面 JavaScript 中引入并创建 Agent 实例。执行指令调用agent.execute()方法传入自然语言指令。观察执行页面右下角会弹出操作面板显示 Agent 的思考步骤Plan和执行状态Running/Done。人工确认当 Agent 无法确定唯一操作目标时如页面有多个“提交”按钮面板会高亮候选元素并等待用户点击确认。典型指令示例“点击登录按钮”“在搜索框输入‘手机’并搜索”“把表单里的姓名改成张三”“找到价格最高的商品并加入购物车”应用场景实例实例 1SaaS 产品 AI 副驾场景一个复杂的 ERP 或 CRM 系统新用户需要经过繁琐的培训才能完成“创建客户档案”操作。应用集成 Page Agent 后用户只需在聊天框输入“帮我创建一个名为阿里巴巴的新客户类型为大客户联系人李四”Agent 自动导航到创建页面填写所有字段并提交极大降低学习成本。实例 2智能表单填写与数据录入场景财务人员每天需要将纸质报表数据录入到几十个字段的 Web 系统中手动操作易错且耗时。应用财务人员口述数据“日期 3月22日项目名差旅费金额 1200”Agent 自动定位对应输入框并填入数据人员仅需最后核对提交。实例 3无障碍访问与语音控制场景视障用户或行动不便者难以使用鼠标精确点击网页上的小按钮或链接。应用结合语音识别技术用户说出“打开收件箱”、“阅读第一封邮件”Page Agent 直接操作 DOM 完成跳转和朗读实现真正的零障碍 Web 交互。GitHub 地址项目仓库https://github.com/alibaba/page-agent