AI 瀏覽器自動化：Playwright CLI 如何省 Token、如何與 Agent 整合

傳統的 AI 瀏覽器自動化方案（如 MCP 模式）通常會將整個網頁的 DOM 結構或大量截圖塞入 AI 的上下文視窗，這不僅導致 Token 消耗巨大，更常因為資訊過載導致 AI 判斷失誤。本文介紹的 Playwright CLI + Skill 框架，透過「按需讀取」與「技能固化」的核心邏輯，能有效降低 4 倍以上的 Token 成本，甚至實現 0 Token 的全自動化生產線。

一、為什麼傳統方案燒 Token？

要理解 Playwright CLI 的省錢之道，先得看清楚舊方案的問題在哪。

MCP 模式的瓶頸

在 MCP（Model Context Protocol）這類整合模式下，AI 每執行一個瀏覽器操作，框架就會把當前頁面的完整 DOM 樹或截圖打包進 Context。一個普通的電商頁面，DOM 輕易超過 10 萬 token；附上截圖更可能讓單次請求飆破 20 萬 token。即便 AI 只是想「點一個按鈕」，也得先「讀完整本書」才能找到那一行字。

Playwright CLI 的核心差異：按需讀取

Playwright CLI 是一個微軟開源的命令行瀏覽器控制工具，它給 AI 的回傳資訊不是整個 DOM，而是一份精簡的網頁摘要（Accessibility Snapshot），只包含可互動元素的描述（按鈕、輸入框、連結等）與當前快照的本地路徑。

流程如下：

AI 下指令

↓

playwright-cli 執行動作，僅回傳摘要 (~500 token)

↓

AI 判斷摘要，決定下一步

↓

如需確認細節，AI 才主動讀取本地快照檔

↓

完成任務

對比 MCP 每步都丟 10 萬 token，Playwright CLI 每步的基礎消耗大約在幾百 token 左右。這就是「4 倍省 Token」的核心機制。

二、與 AI Agent 整合的原理：Skill 系統

光靠 CLI 還不夠。如果每次任務都讓 AI 從零開始「思考如何操作瀏覽器」，該思考過程本身就得消耗 Token。Skill（技能） 就是解決這個問題的第二層優化。

Skill 的本質

Skill 是一份 Markdown 格式的說明文件，放在 Agent 框架（如 Antigravity / Cloud Code / Codex）可以讀取的技能目錄下。文件寫清楚：

• 這個工具/流程的用途

• 可用的指令與參數

• 常見的操作步驟範例

• 已知的坑與處理方式

Agent 框架在啟動時會讀取這份文件，之後 AI 執行相關任務時就不用重新「想」如何操作，直接調用技能中的知識庫，大幅壓縮推理 Token。

Skill 目錄放置位置

| Agent 框架 | Skill 目錄 |

|---|---|

| Antigravity | .gemini/antigravity/skills/ |

| Cloud Code | .claude/skills/ |

| Codex | .codex/skills/ |

三、一步一步示範：從任務到 0 Token 自動化

以下用「抓取電商評論並存成 CSV」為例，走完三個階段。

第一步：探索（讓 AI 初次嘗試）

用自然語言下指令，讓 AI 帶著 Playwright CLI 去試水溫：

提示詞：

「請使用 playwright-cli 打開 https://example-shop.com/product/123，加上 --headed --persistent 參數。找到評論區塊，抓取前 100 條用戶評論（包含用戶名、星級、內容），存成 comments.csv。過程中遇到截圖才讀快照，其他步驟只用摘要回覆。」

--headed 讓瀏覽器視窗可見，方便你觀察；--persistent 保存登錄狀態，不用每次重新驗證碼。

AI 會開始逐步執行，每步回覆摘要，遇到找不到元素才讀快照。整個過程的 Token 消耗大概只有 MCP 方案的 20~25%。

第二步：固化（把經驗鎖進 Skill）

AI 成功完成任務後，立刻要求它把這次的操作邏輯提煉成 Skill：

提示詞：

「太好了。現在把剛才的完整流程——打開頁面、定位評論區、處理分頁、保存 CSV——還有遇到的坑（例如評論用了 lazy-load 要等待）都整理成一份 Skill 文件，存到 .claude/skills/scrape-comments.md。格式要讓以後我說『幫我抓評論』，你就直接照這個流程走，不用重新想。」

這份 Skill 文件建立之後，下次執行「抓評論」任務時，AI 不需要再推理流程，直接調用技能，Token 消耗從 40% 降至 5% 以下。

第三步：腳本化（0 Token 的全自動生產線）

對於完全固定的重複任務，可以更進一步，讓 AI 把成功的操作序列直接輸出成腳本：

提示詞：

「把剛才所有成功的 playwright-cli 命令匯總成一個 PowerShell 腳本 scrape.ps1。每一步之間加入合理的等待（等頁面載入、等評論出現）。腳本執行後應能全程無人值守，完成抓取並存檔。」

腳本一旦生成，定時執行就是系統層面的工作（Task Scheduler / Cron Job），AI 完全退場，Token 消耗歸零。

四、三個階段的 Token 對比

| 階段 | 方式 | AI 介入程度 | Token 消耗 |

|---|---|---|---|

| 探索 | Playwright CLI + 自然語言 | 高（逐步推理） | ~20% vs MCP |

| 固化 | Playwright CLI + Skill | 低（直接調用） | ~5% vs MCP |

| 腳本化 | 純腳本執行 | 無 | 0 Token |

五、實戰補充：哪些任務最適合這套框架？

• 定期資料抓取：電商評論、股價、新聞標題——固化後即可零 Token 排程。

• WebAPP 自動化測試：讓 AI 讀源碼理解邏輯，再用 playwright-cli 跑回歸測試，比手工 QA 快 10 倍。

• 社群圖文發布：先 Python 腳本預處理圖片，再讓 playwright-cli 模擬貼文上傳流程，解決平台不提供 API 的痛點。

透過這套 CLI + Skill 的工作流，開發者能將 AI 從「單純的對話機器人」轉變為「精通業務流程的操作員」。探索、固化、腳本化，三個階段環環相扣，最終讓 AI 的介入越來越少，生產力卻持續提升。

--

📢 聲明： 本文 AI 寫作比例達 90% 以上，作為作者意志之延伸工具。