Page Agent 開源：一行腳本為網頁注入 AI 代理

Page Agent 是阿里巴巴於 2025 年 9 月開源的頁內 GUI 代理，GitHub 累積 29,563 顆星標與 2,641 個分支，採 MIT 授權。它以單一 JavaScript 檔案注入網頁，以文字化 DOM 描述操作介面，無需外掛或無頭瀏覽器，並可接上自備的大型語言模型。

Page Agent 是什麼？

Page Agent 是阿里巴巴開源的頁內 GUI 代理，以單一 JavaScript 檔案嵌入網頁，用文字化 DOM 描述頁面，無需外掛、無頭瀏覽器或截圖，可接上自備模型。

名稱中的 Page 說明作用範圍。它不接管整個瀏覽器，只在當前頁面內執行任務，理解畫面結構、定位按鈕與輸入框、按步驟完成操作。這個選擇讓整合方式從部署服務變成貼上一行腳本。

專案由阿里巴巴的工程團隊主導，2025 年 9 月 23 日建立倉庫，主要作者為 Simon（GitHub 帳號 gaomeng1900）。README 直接把定位寫成「住在網頁裡的 GUI 代理」，並以 SaaS 副駕駛、智能表單填寫、無障礙增強三類場景說明用途。

與常見的瀏覽器代理相比，這個專案的差異集中在執行位置。代理程式碼與使用者介面同處一個頁面，因此能直接讀寫 DOM，也能把操作面板渲染在頁面右下角，形成一個內建的操作介面。

一行腳本如何在網頁內運作？

載入腳本後，PageAgent 會掃描頁面元素並轉成文字描述，連同使用者指令送交模型，模型回傳下一步動作，代理執行動作後重新觀察頁面，逐輪推進直到任務完成。

README 提供兩種接入方式。最快速的做法是在 HTML 插入指向 jsDelivr 的 script 標籤，載入後自動建立示範代理；若使用 npm，則以 PageAgent 建構子傳入模型名稱、相容端點、金鑰與介面語言，再呼叫 execute 方法下達指令。

運作邏輯屬於觀察與行動的循環。代理先把可互動元素整理成帶索引的文字清單，交由模型判斷應點擊或輸入的目標，取回動作結果後重新掃描頁面，再決定下一步。整個過程不需要螢幕截圖，因此不依賴具備視覺能力的模型。

公開的示範 CDN 使用官方免費測試模型，README 明確標注僅供技術評估，並要求使用者同意相關條款與隱私說明。正式接入必須換上自備的模型端點，開發文件亦提供以 qwen3.5-plus 搭配 DashScope 相容模式的範例。

Page Agent 與瀏覽器自動化工具的分別在哪裡？

傳統工具在瀏覽器外以協定驅動頁面，需要獨立程序與權限；Page Agent 在頁面內執行 JavaScript，共用已登入狀態，省去啟動成本，但範圍限於單頁。

Playwright 與 Puppeteer 屬於外部驅動模式。程式在瀏覽器之外啟動實例、建立連線、發送指令，適合測試與批次抓取，代價是需要額外程序、需要處理登入狀態，也難以進入使用者的日常瀏覽流程。

Page Agent 走的是頁面內嵌路線。代理與應用共用同一份執行環境，天然繼承登入態與前端狀態，開發者只需在前端加入依賴，不必維運代理服務。對於已經上線的企業內部系統，這條路徑的改動面積明顯較小。

代價落在範圍與能力兩端。頁面內代理無法跨分頁作業，也不能存取瀏覽器層級的功能；若要跨頁執行，必須另行安裝官方擴充功能。它亦無法繞過同源政策，遇到跨域資料時仍需靠後端配合。

Page Agent 如何接上自備模型？

代理透過 OpenAI 相容介面呼叫模型，開發者只需提供模型名稱、端點位址與金鑰，即可接上雲端服務或本地部署的開源模型，文件另附免費測試端點供評估。

README 把自備模型列為核心設計。設定項包含 model、baseURL、apiKey 與 language 四個欄位，只要端點支援 OpenAI 相容格式，就能直接使用。這個約定讓代理不必綁定單一供應商。

本地部署因而成為可行選項。文件說明支援多數主流模型與自行架設的服務，對於資料不能外流的場景，可以指向內網推論服務，把頁面結構與操作指令留在企業網路之內。

語言設定涵蓋多語介面。代理會依 language 參數調整回覆與操作提示的語言，官方示範同時提供英文與中文文件，擴充功能的操作面板亦已國際化。這對華語市場的內部系統推廣有實際幫助。

它的架構由哪些套件組成？

專案採 npm 工作區的單一倉庫結構，拆出主套件、核心邏輯、模型客戶端、頁面控制器、介面層與 MCP 伺服器六個發佈單元，另有擴充功能與官網兩個應用。

拆分方式反映職責邊界。page-agent 是含操作面板的主入口，@page-agent/core 只保留代理邏輯、不含介面，@page-agent/page-controller 負責 DOM 操作與視覺回饋，@page-agent/llms 封裝模型客戶端，@page-agent/ui 提供面板與多語資源。

這種切法讓整合方可以按需取用。只需要後端整合的團隊可引用核心套件，自行繪製介面；需要在現成產品加入副駕駛的團隊則直接使用主套件，省去介面開發。官方說明把模型客戶端的設計描述為「行動前先反思」，屬於提示層面的約束。

專案同時承認技術來源。README 指出 DOM 處理元件與提示詞衍生自開源專案 browser-use，並保留原作者的 MIT 授權聲明。這類標注在代理框架之間並不常見，對商用評估有參考價值。

這套方案有哪些實際應用場景？

官方舉出四類場景：產品內建 AI 副駕駛、企業表單自動填寫、以自然語言操作網頁的無障礙功能，以及透過擴充功能延伸的跨頁任務與 MCP 瀏覽器控制。

企業內部系統是最直接的落點。README 以 ERP、客戶關係管理與後台管理系統為例，說明把二十次點擊的流程壓縮成一句指令，對於流程固定、欄位繁多、員工培訓成本高的場景，改造成本低於重寫前端。

無障礙用途值得單獨看待。代理可以把任意網頁介面轉為自然語言操作入口，配合語音指令與螢幕閱讀器，讓視障使用者以對話方式完成原本需要精確點擊的流程。這類需求在公共服務網站尤其明顯。

外部整合則靠 MCP 伺服器。官方提供測試階段的 MCP 套件，讓既有的代理客戶端透過協定控制瀏覽器；專案另備 Chrome 擴充功能處理跨分頁任務。兩者都把能力邊界從單一頁面往外推了一步，但成熟度仍待觀察。

Page Agent 存在哪些限制與風險？

代理需要讀取頁面結構才能運作，等於把畫面內容送往模型端點，資料外流風險須自行評估；跨頁能力依賴擴充功能，未結問題達 112 項，核心倉庫近期提交亦明顯放緩。

資料流向是最需要提前決定的部分。文字化 DOM 會把頁面上的標籤、欄位名稱與部分內容送到模型，若頁面含個資或商業機密，必須改指向內網模型或先做遮罩處理。README 的示範 CDN 使用官方免費端點，僅適合技術評估。

穩定性亦有現實邊界。目前未結問題 112 項，官方在其中一則維護者說明中交代設計原則與現況，並明確表示不接受完全由機器人或 AI 生成、缺乏實質人力參與的貢獻。這項表態對專案品質是正面訊號。

維護節奏值得留意。倉庫最後一次提交為 2026 年 9 月 6 日，最新版本 1.12.4 同日發佈，此後未見新提交。以一個月近十萬次下載的套件而言，這個靜止期需要觀察，採用前宜先確認自身所需的修正是否已被涵蓋。

專案數據反映什麼維護狀況？

29,563 顆星標對 33 位貢獻者，屬核心團隊主導型專案；39 個版本標籤與每月近十萬次下載顯示採用面已成形，但提交節奏自 9 月起停頓。

下載量與星標的比值值得對照。npm 套件在最近三十日錄得 99,642 次下載，最近一週為 19,806 次，代表下載曲線仍在流動；對照 2,641 個分支，實際整合進生產環境的比例不易從公開數據判斷。

貢獻結構偏集中。33 位貢獻者對應近三萬顆星標，密度低於同級工具型專案，通常意味主要程式碼由核心成員掌握，外部參與集中在文件、翻譯與問題回報。中文文件獨立維護，反映華語社群投入較深。

版本節奏前期密集。自 2025 年 9 月首發至 2026 年 9 月，專案累積 39 個版本標籤與 78 個 npm 版本，平均每月約三次發佈。這種小步推進的方式利於修正，但同時要求採用方具備快速跟版的能力。

出處連結有哪些？

專案原始碼與完整文件位於 GitHub 的 alibaba/page-agent 倉庫，官方示範網站與文件站另設於 alibaba.github.io，授權條款為 MIT。

原始碼與問題追蹤集中於 GitHub 倉庫 alibaba/page-agent，文件站與互動示範則部署在 alibaba.github.io/page-agent。開發者可先透過示範頁評估代理在真實表單上的表現，再決定是否引入專案。

專案亦在 Hacker News 留下公開討論串，維護者在倉庫的 issue 區說明了設計原則與目前狀態，對於評估長期可用性的團隊，這兩處的內容比 README 更具參考價值。

總結：Page Agent 適合哪些團隊？

適合需要在既有網頁產品內快速加入 AI 操作入口、且能控管模型端點的團隊；若需求涉及跨站批次作業或長期高頻維護，外部驅動的瀏覽器框架仍是更穩的選擇。

這個專案把代理的部署門檻降到一行腳本，同時把能力範圍收窄到單一頁面。對於已上線的企業系統、需要語音或自然語言入口的公共服務，這是一個改動面積小、可快速驗證的選項。

評估時應把三件事放在前面。模型端點能否控制在內網、頁面內容是否允許離開組織邊界、跨頁需求是否真的存在。三項都能接受，再考慮採用；任何一項無法接受，外部驅動的方案會更合適。