Playwright MCP Server:基于語義化DOM快照的AI Agent網(wǎng)頁交互解決方案
摘要:想讓 AI Agent 穩(wěn)定操作網(wǎng)頁?別再被 OCR 識別不準(zhǔn)、視覺模型顯存爆炸、DOM 一變就崩這些問題卡住。Playwright MCP Server 上線了——首個生產(chǎn)可用、開箱即用的結(jié)構(gòu)化網(wǎng)頁交互 MCP 服務(wù)。 它不截圖,不調(diào) VLM。靠 Playwright 實(shí)時生成**語義化 + 無障礙(a11y)DOM 快照**:按鈕帶 `role="button"`,...

想讓 AI Agent 穩(wěn)定操作網(wǎng)頁?別再被 OCR 識別不準(zhǔn)、視覺模型顯存爆炸、DOM 一變就崩這些問題卡住。Playwright MCP Server 上線了——首個生產(chǎn)可用、開箱即用的結(jié)構(gòu)化網(wǎng)頁交互 MCP 服務(wù)。
它不截圖,不調(diào) VLM。靠 Playwright 實(shí)時生成**語義化 + 無障礙(a11y)DOM 快照**:按鈕帶 `role="button"`,表單字段含 `name` 和可讀的 `label text`,動態(tài)加載區(qū)域標(biāo) `aria-busy="true"`。LLM 直接讀 JSON 快照,就能準(zhǔn)確定位“登錄郵箱輸入框”或“第 3 頁‘立即購買’按鈕”,不用猜 XPath,不怕 CSS 類名重命名。
對 Agent 開發(fā)者來說,這是協(xié)議層的關(guān)鍵拼圖:MCP 定義“我能做什么”,A2A 定義“我找誰做”,而 Playwright MCP Server 就是那個**可靠執(zhí)行網(wǎng)頁任務(wù)的‘手’**。寫幾行 Python 做個 MCP 客戶端,連上它,Claude 或龍蝦 Agent 就能干真實(shí)業(yè)務(wù)——比如自動填完 50 家 SaaS 官網(wǎng)的試用表單(含驗(yàn)證碼繞過邏輯),或每小時抓競品價格、觸發(fā)飛書告警。
實(shí)戰(zhàn)案例:招標(biāo)信息監(jiān)控 Bot
- Agent:龍蝦 + Playwright MCP Server
- 目標(biāo)站:中國政府采購網(wǎng)(反爬強(qiáng)、JS 渲染、分頁異步)
- 快照里直接提取 `<a class="title-link" aria-label="XX市智慧醫(yī)療招標(biāo)公告(編號:ZB2024-087)">` → LLM 解析出項目名稱、預(yù)算、截止日
- 自動寫入 Notion 數(shù)據(jù)庫 + 郵件推送關(guān)鍵線索
- 已上線:單 Bot 日均捕獲高匹配度標(biāo)訊 12 條,交付本地 IT 集成商,按線索收費(fèi) 80 元/條,月毛利 ≈ 2.8 萬元(服務(wù)器成本 < 200 元)
?? [Binance](https://idsoo.com/go/binance.html) · [OKX](https://idsoo.com/go/okx.html) · [Gate.io](https://idsoo.com/go/gate.html) · [HTX](https://idsoo.com/go/htx.html) · [Bitget](https://idsoo.com/go/bitget.html)
這不是 Demo。Server 核心已開源:[github.com/yitb/playwright-mcp](https://github.com/yitb/playwright-mcp)
Docker 一鍵啟: docker run -p 3000:3000 yitb/playwright-mcp:latest
龍蝦 CLI 一行注冊: yitb server register --url http://localhost:3000 --type mcp --name web-interact
你的 Agent 立刻獲得“看懂網(wǎng)頁 + 點(diǎn)準(zhǔn)按鈕”的能力。
別再用 Selenium 硬扛 CSS 選擇器,也別為 VLM 顯存燒錢。Playwright MCP Server 把網(wǎng)頁自動化從“玄學(xué)調(diào)參”拉回“確定性工程”。
**馬上試試**:
1. `git clone https://github.com/yitb/playwright-mcp && cd playwright-mcp && make up`
2. 打開 http://localhost:3000/docs —— 運(yùn)行第一個 MCP 調(diào)用示例(填 Google 搜索框并提交)
3. 在龍蝦控制臺執(zhí)行 `yitb agent create --template web-scraper`,把剛起的服務(wù)接入你的 Agent
4. 今天下班前,讓它替你搶一次 12306 候補(bǔ)名額。