Page Agent – 阿里開源的 JavaScript GUI 智能體庫

如何使用Page Agent

• 快速體驗：在網頁中插入一行 <script> 標籤引入 Page Agent 的 IIFE 演示腳本，即可在頁面上激活 AI 操控面板。
• 安裝依賴：生產環境通過 npm install page-agent 安裝依賴包，將其引入到你的前端項目中。
• 創建實例：用 new PageAgent() 創建實例，配置 model、baseURL、apiKey 等參數指向你的 OpenAI 兼容模型端點。
• 執行指令：調用 agent.execute('你的自然語言指令') 讓 AI 解析指令並自動在頁面 DOM 中定位元素、執行點擊或輸入等操作。
• 安全配置：可選配置操作白名單、數據脫敏規則和關鍵操作確認，確保 AI 行爲符合安全與業務要求。

Page Agent的核心優勢

• 零後端改造：嵌入一行腳本即可，無需重寫後端或分發瀏覽器擴展。
• 低成本運行：僅傳輸文本 DOM 結構，無需多模態視覺模型，顯著降低 Token 消耗。
• 原生安全繼承：頁面原有的 UI 校驗、權限規則繼續生效，敏感數據可脫敏。
• 模型無關：支持任何 OpenAI 兼容端點，切換模型僅需改 baseURL。
• MIT 開源：TypeScript 編寫，代碼完全開放，可自由定製。

Page Agent的項目地址

• 項目官網：https://alibaba.github.io/page-agent/
• GitHub倉庫：https://github.com/alibaba/page-agent

Page Agent的同類競品對比

Page Agent的應用場景

• SaaS 產品 AI 副駕駛：在自家產品中嵌入助手，直接幫用戶執行操作而非僅給出文字指引。
• 智能表單填寫：將多步 ERP/CRM 表單壓縮爲一句指令，如”提交昨天午餐 50 元差旅報銷”。
• 無障礙訪問：結合 Web Speech API 實現語音控制網頁，提升視障用戶操作體驗。
• 遺留系統現代化：爲無 API 的舊系統添加自然語言命令欄，無需改動原始代碼。