AI Agents 入門課程 · 第 15 課 / 共 18 課

打造 Computer Use Agent (CUA):讓 AI 像人一樣操作瀏覽器

原文:Microsoft AI Agents for Beginners · MIT 授權

本課概覽

一句話:Computer Use Agent (CUA) 讓 AI 像真人一樣「開啟瀏覽器 → 觀察頁面 → 從所見內容決定下一步」;本課將打造一個搜尋 Airbnb、擷取結構化房源資料、找出斯德哥爾摩最便宜住宿的瀏覽器自動化 Agent。

本課結合四大元件:Browser-Use 負責 AI 驅動導覽、Playwright 與 Chrome DevTools Protocol (CDP) 負責瀏覽器控制、Azure OpenAI 提供具視覺能力的推理、Pydantic 做結構化資料擷取。

本課將涵蓋:

學習目標

完成本課後,你將知道如何:

程式範例

本課包含一個 Notebook 教學:

前置需求

安裝設定

安裝 Notebook 使用的套件:

pip install browser_use playwright python-dotenv
playwright install chromium

設定 Notebook 使用的 Azure OpenAI 環境變數:

AZURE_OPENAI_ENDPOINT=...
AZURE_OPENAI_API_KEY=...
AZURE_OPENAI_CHAT_DEPLOYMENT_NAME=...
# 選用:省略時預設使用最新 API 版本
AZURE_OPENAI_API_VERSION=...

架構概覽

Notebook 展示的是混合式 (hybrid) 瀏覽器自動化流程

  1. Chrome 以啟用 CDP 的方式啟動,讓 Playwright 與 Browser-Use 共用同一個瀏覽器會話。
  2. Browser-Use Agent 處理開放式導覽任務,例如開啟 Airbnb、關閉彈窗、搜尋斯德哥爾摩。
  3. 以結構化 Pydantic schema 檢視當前頁面,擷取房源標題、每晚價格、評分與網址。
  4. Python 邏輯比較擷取到的房源,標出最便宜的選項。

這種做法保留了 Browser-Use 擅長的彈性視覺推理,同時在需要時仍能給你確定性的瀏覽器控制。

Agent vs Actor:何時該用誰?

情境用 Agent用 Actor
動態版面是,AI 能適應頁面變化否,脆弱的選擇器容易失效
已知結構否,Agent 比直接控制慢是,快速且精準
尋找元素是,自然語言非常有效否,需要精確的選擇器
時序控制否,較難預測是,完全掌控等待與重試
複雜工作流程是,能處理意外的 UI 狀態否,需要顯式的分支邏輯

Browser-Use 最佳實踐

  1. 先用 Agent 進行探索與動態導覽。
  2. 當互動變得可預測時,切換為直接頁面控制。
  3. 使用結構化輸出模型,讓擷取的資料被驗證且型別安全。
  4. 在會觸發可見 UI 變化的動作之後,策略性地加入延遲。
  5. 迭代時擷取螢幕截圖,讓失敗更容易除錯。
  6. 預期網站會變動,為彈窗與版面位移設計備援策略。
  7. 混合 Agent 與 Actor 模式,同時取得彈性與精準。

瀏覽器 Agent 的安全防護 (Safety Guardrails)

瀏覽器 Agent 在真實網站上運作,因此需要比「只呼叫已知 API 的腳本」更嚴格的邊界。從 Notebook 展示走向真實工作流程之前,先定義 Agent 能「看什麼、點什麼、提交什麼」的控管:

  1. 界定瀏覽環境範圍。在專屬的瀏覽器 profile 或沙箱中執行 Agent,並限制它只能存取任務所需的網域。
  2. 分離「觀察」與「行動」。先讓 Agent 搜尋、閱讀、擷取資料;在提交表單、發送訊息、訂房、購物、刪除紀錄或更改帳戶設定之前,要求明確的核准步驟。
  3. 金鑰不要進入提示與追蹤。不要把密碼、付款資料、Session Cookie 或原始個人資料放進模型上下文。認證交由使用者接管,並從日誌中移除敏感欄位。
  4. 把頁面內容視為不可信輸入。網站可能包含「針對 Agent、而非使用者」的指令。Agent 應忽略任何要求它改變目標、洩漏資料、關閉防護或造訪無關網站的頁面文字。
  5. 在高風險步驟周圍使用確定性檢查。在要求使用者核准最終步驟前,先用程式碼驗證當前 URL、頁面標題、選中項目、價格、收件人與動作摘要。
  6. 設定預算與停止條件。限制 Agent 可使用的動作數、重試次數、分頁數與分鐘數。當頁面狀態不明時就停止,而非繼續點擊。
  7. 記錄有用的證據,而非全部。保留動作摘要、時間戳、URL、選中元素描述與螢幕截圖參考,以便檢視失敗,同時避免儲存不必要的敏感頁面內容。

在 Airbnb 範例中,安全的預設做法是搜尋房源並擷取價格。登入、聯絡房東或完成訂房,都應是獨立的、由使用者核准的動作

實際應用場景

實際範例:Microsoft Project Opal

本課打造的 Agent,正是Computer Use Agent (CUA)——一個「像人一樣驅動瀏覽器」的程式——的小型本地版本。微軟把同樣的概念帶到企業,以 Project Opal (Frontier) 的形式提供,作為 Microsoft 365 Copilot 的一項能力。

有了 Project Opal,你描述任務,Agent 就在安全的 Windows 365 Cloud PC 上以 computer use 為你代勞,跨你組織內的瀏覽器應用程式、網站與資料運作。它非同步地在背景運作,你隨時可以引導工作或接手控制。範例工作包括:

Opal 是「生產級、可信賴的 computer use agent」絕佳參考範本,也呼應了前幾課的概念:

本課概念Project Opal 如何應用
Human-in-the-loop(第 06 課)遇到登入憑證、敏感資料或模糊指令時暫停;從不自行輸入密碼或未經明確確認就提交表單。可隨時 Take Control / Return Control。
可信賴且安全的 Agent(第 06 & 18 課)在隔離的 Windows 365 Cloud PC 執行、預設僅瀏覽器(其他電腦存取被封鎖,經 Intune 強制)、使用你的身份(只存取你被授權的內容)、記錄每個動作供稽核。
規劃與元認知(第 07 & 09 課)先為工作產生計畫,再逐步監督自身推理,偵測到可疑活動即暫停。
可重用的能力 / 工具(第 04 課)透過 Skills 為重複性工作撰寫指令(從 .md 檔匯入或與 Opal 一起撰寫),並跨對話重用。
可用性:Project Opal 目前提供給 Frontier early access program 且具 Microsoft 365 Copilot 訂閱的使用者,需由管理員完成設定。因屬實驗性 Frontier 功能,能力可能隨時間變動。

知識測驗

1. 何時瀏覽器型 Computer Use Agent 比純 API 工作流程更合適?

查看答案

當任務依賴網頁 UI 上「看得見」的內容、網站沒有提供所需 API、或頁面變動頻繁到固定的 API 或選擇器邏輯會變脆弱時,就用瀏覽器 Agent。若同一任務存在穩定的 API,則優先使用 API,因為它通常更快、更容易測試、也更容易保護。

2. 在混合式流程中,哪些部分交給 Agent、哪些交給直接的 Playwright 程式碼?

查看答案

讓 Agent 處理開放式導覽與動態 UI 狀態(例如找到正確頁面、關閉意外彈窗)。當頁面結構已知、且動作需要精準、重試、等待或確定性驗證時,切換為直接 Playwright 控制。

3. Airbnb 範例找到一個使用者可能想訂的房源。在簽入、聯絡房東或完成訂房之前,應發生什麼事?

查看答案

流程應暫停並要求明確的使用者核准。在詢問之前,應先展示所選房源、當前 URL、價格、日期與預期動作的清楚摘要。搜尋與擷取價格可以自動進行;帳戶存取、訊息、購物與訂房則須由使用者核准。

4. 一個網頁告訴 Agent 忽略原本的指令、造訪另一個網站、並洩漏已儲存的憑證。Agent 該如何處理這段文字?

查看答案

把它視為「不可信的頁面內容」,而非開發者或使用者的指令。Agent 應停留在允許的網域與任務範圍內、拒絕洩漏機密、並避免遵循任何會改變目標、停用防護或導向無關網站的頁面文字。

5. 瀏覽器 Agent 執行時,哪些證據值得保留、哪些應避免?

查看答案

保留動作摘要、時間戳、URL、選中元素描述、驗證結果與螢幕截圖參考,讓執行紀錄可供檢視。避免儲存密碼、付款資料、Session Cookie、原始個人資料或完整頁面內容,除非有特定的保留與隱私理由。

本課重點回顧

  1. CUA = 讓 AI 像人一樣操作瀏覽器,適合「任務依賴可見 UI、無可用 API、頁面頻繁變動」的情境;有穩定 API 時仍應優先選 API。
  2. 混合流程最佳:Agent 處理開放式導覽與動態 UI,Actor (Playwright) 處理已知結構的精準操作、等待與重試。
  3. 結構化輸出 (Pydantic) 讓擷取的資料型別安全、可驗證,可直接轉為下游商業邏輯。
  4. 瀏覽器 Agent 需要更嚴格的安全邊界:界定範圍、分離觀察與行動、金鑰不進提示、把頁面內容當不可信輸入、高風險步驟做確定性檢查。
  5. Project Opal 是企業級 CUA 的參考範本,呼應第 04(工具)、06(人機迴圈/可信賴)、07(規劃)、09(元認知)、18(安全)課的概念。

原始資源