🔥阿里开源神器！一行代码让网站秒变 AI 原生应用，Page-Agent 太强了！
<h2 id="前言">前言</h2><p>最近发现了一个超厉害的开源项目——<strong>Page-Agent</strong>，这是阿里巴巴开源的浏览器内 GUI Agent 框架，只需要一行代码就能让你的网站秒变 AI 原生应用！今天就来给大家详细扒一扒这个神器。</p>
<p><img src="https://img2024.cnblogs.com/blog/2052055/202603/2052055-20260307162248906-207858349.png" alt="image" loading="lazy"></p>
<h2 id="什么是-page-agent">什么是 Page-Agent？</h2>
<p>Page-Agent 是一个纯前端的浏览器内 GUI Agent 框架，它的核心理念是：<strong>让任何网站都能轻松集成 AI 能力，无需后端部署</strong>。</p>
<h3 id="核心特点">核心特点</h3>
<p>✅ <strong>纯前端方案</strong> - 无需后端服务器，直接在浏览器内运行<br>
✅ <strong>支持多种 LLM</strong> - OpenAI、Claude、DeepSeek、Qwen、Gemini、Grok、Ollama、Kimi、GLM、LLaMA 等<br>
✅ <strong>隐私优先</strong> - 所有操作都在浏览器内完成，数据不会外泄<br>
✅ <strong>人机协同</strong> - 内置确认面板，用户可以实时查看和确认 AI 的操作<br>
✅ <strong>MIT 开源</strong> - 完全免费，可商用<br>
✅ <strong>轻量级</strong> - 版本号 1.5.2，持续更新维护</p>
<h2 id="核心功能">核心功能</h2>
<h3 id="1️⃣-智能表单填写">1️⃣ 智能表单填写</h3>
<p>Page-Agent 可以自动识别网页中的表单字段，根据用户指令智能填写，大大提升工作效率。</p>
<h3 id="2️⃣-saas-ai-副驾驶">2️⃣ SaaS AI 副驾驶</h3>
<p>为 SaaS 应用添加 AI 助手，让用户通过自然语言即可完成复杂操作。</p>
<h3 id="3️⃣-无障碍增强">3️⃣ 无障碍增强</h3>
<p>帮助残障人士更好地使用网页，提供语音控制和智能导航功能。</p>
<h3 id="4️⃣-多页面任务控制">4️⃣ 多页面任务控制</h3>
<p>通过浏览器扩展支持跨页面的复杂任务执行，实现真正的自动化工作流。</p>
<h2 id="快速开始">快速开始</h2>
<p>使用 Page-Agent 非常简单，只需要在你的网站中引入一行代码：</p>
<pre><code class="language-javascript">import { PageAgent } from '@alibaba/page-agent';
const agent = new PageAgent({
model: 'gpt-4',
apiKey: 'your-api-key'
});
agent.run('帮我填写这个表单');
</code></pre>
<p><img src="https://alibaba.github.io/page-agent/demo.gif" alt="使用示例" loading="lazy"></p>
<h2 id="支持的模型">支持的模型</h2>
<p>Page-Agent 支持市面上主流的几乎所有大语言模型：</p>
<ul>
<li>🤖 OpenAI (GPT-4, GPT-3.5)</li>
<li>🧠 Claude (Anthropic)</li>
<li>🚀 DeepSeek</li>
<li>💫 Qwen (通义千问)</li>
<li>✨ Gemini (Google)</li>
<li>🔥 Grok (xAI)</li>
<li>🦙 Ollama (本地部署)</li>
<li>🌟 Kimi (月之暗面)</li>
<li>🎯 GLM (智谱 AI)</li>
<li>📚 LLaMA (Meta)</li>
</ul>
<h2 id="技术架构">技术架构</h2>
<p>Page-Agent 采用纯前端架构，主要包含以下模块：</p>
<ol>
<li><strong>DOM 解析器</strong> - 智能分析网页结构</li>
<li><strong>操作执行器</strong> - 模拟用户交互行为</li>
<li><strong>确认面板</strong> - 人机协同交互界面</li>
<li><strong>LLM 适配器</strong> - 统一接口支持多种模型</li>
</ol>
<h2 id="应用场景">应用场景</h2>
<h3 id="-企业办公">🏢 企业办公</h3>
<ul>
<li>自动填写各类业务系统表单</li>
<li>批量处理数据录入任务</li>
<li>跨系统数据同步</li>
</ul>
<h3 id="-电商平台">🛒 电商平台</h3>
<ul>
<li>智能客服助手</li>
<li>自动订单处理</li>
<li>商品信息批量管理</li>
</ul>
<h3 id="-数据分析">📊 数据分析</h3>
<ul>
<li>自动抓取网页数据</li>
<li>生成数据报告</li>
<li>可视化图表制作</li>
</ul>
<h3 id="-无障碍辅助">♿ 无障碍辅助</h3>
<ul>
<li>语音控制网页浏览</li>
<li>智能内容朗读</li>
<li>简化操作流程</li>
</ul>
<h2 id="总结">总结</h2>
<p>Page-Agent 作为一个开源的浏览器内 GUI Agent 框架，为我们提供了一种全新的网站智能化方案。它不需要后端部署，支持多种大模型，隐私安全，非常适合想要快速为网站添加 AI 能力的开发者。</p>
<p>如果你也在寻找一种简单高效的方式来为你的网站或应用添加 AI 交互能力，那么 Page-Agent 绝对值得一试！</p>
<p><strong>项目地址</strong>: https://alibaba.github.io/page-agent</p>
<p><strong>GitHub</strong>: https://github.com/alibaba/page-agent</p>
<hr>
<p><em>觉得这篇文章对你有帮助的话，欢迎点赞收藏转发！</em></p><br><br>
来源：https://www.cnblogs.com/fhysy/p/19683524
頁:
[1]