Playwright MCP

該項目利用Playwright進行自動化瀏覽器測試，並與Cloudflare Workers、Browser Rendering和@cloudflare/playwright集成部署，支持通過AI助手進行網頁交互操作。

瀏覽器自動化開發者工具 #自動化測試 #瀏覽器交互 #AI助手 #雲部署 Local .TypeScript

rating : 2.5 points

downloads : 50

update time : 2025-04-28

什麼是Cloudflare Playwright MCP？

Cloudflare Playwright MCP是一個基於Playwright的自動化瀏覽器操作工具，支持開發者通過模型生成指令來完成網頁交互任務。它能夠幫助用戶實現如截圖、點擊、輸入等操作，廣泛應用於測試、AI協作等領域。

如何使用Cloudflare Playwright MCP？

只需部署服務器並配置模型連接即可開始使用。通過簡單的指令觸發工具執行操作，例如導航到特定頁面或進行截圖。

適用場景

適合需要頻繁進行網頁交互或自動化測試的場景，例如網站監控、數據抓取、智能客服等。

主要功能

自動化瀏覽器操作支持多種瀏覽器操作，如點擊、輸入、拖拽等。

工具模式切換提供快照模式（默認）和視覺模式兩種交互方式，滿足不同需求。

多工具支持內置多個實用工具，包括截圖、上傳文件、保存PDF等。

優勢與侷限性

優勢

強大的自動化能力，提升工作效率。

兼容多種設備和瀏覽器。

簡單易用，無需複雜配置。

侷限性

對網絡環境有一定依賴。

部分高級功能可能需要額外付費。

如何使用

安裝依賴

在項目目錄下運行 `npm ci` 安裝所需依賴。

構建項目

進入 `cloudflare` 文件夾後執行 `npm run build`。

部署到Cloudflare Workers

使用 `wrangler` 工具進行部署。

使用案例

打開TodoMVC示例並添加待辦事項模擬用戶打開TodoMVC示例應用，並創建新的待辦事項。

執行一系列瀏覽器操作從打開頁面到最終截圖，展示完整的操作流程。

常見問題

如何啟動Cloudflare Playwright MCP服務器？

是否支持自定義工具？

🚀 雲flare工具命令參考

本項目提供了一系列雲flare工具命令，涵蓋選項卡管理、導航、鍵盤操作等多個功能，方便用戶對瀏覽器進行各種操作。

🚀 快速開始

本項目主要提供了雲flare工具的命令參考，你可以根據需求使用這些命令對瀏覽器進行操作。

✨ 主要特性

提供豐富的瀏覽器操作命令，包括選項卡管理、導航、鍵盤操作等。
命令參數詳細，方便用戶根據具體需求進行操作。

📚 詳細文檔

🔍 選項卡管理

命令	描述	參數
`browser_tab_list`	列出瀏覽器標籤頁	無
`browser_tab_new`	打開新標籤頁	`url`（字符串，可選）：要導航到的新標籤頁的 URL。如果未指定，則新標籤頁為空。
`browser_tab_select`	通過索引選擇標籤頁	`index`（數字）：要選擇的標籤頁的索引
`browser_tab_close`	關閉標籤頁	`index`（數字，可選）：要關閉的標籤頁的索引。如果不指定，則關閉當前標籤頁。

🔍 導航

命令	描述	參數
`browser_navigate`	導航到指定 URL	`url`（字符串）：要導航到的 URL
`browser_navigate_back`	返回上一頁	無
`browser_navigate_forward`	前進到下一頁	無

🔍 鍵盤操作

命令	描述	參數
`browser_press_key`	按鍵盤上的某個鍵	`key`（字符串）：要按下的鍵的名稱或生成字符，例如 `ArrowLeft` 或 `a`

🔍 控制檯

命令	描述	參數
`browser_console_messages`	返回所有控制檯消息	無

🔍 文件和媒體

命令	描述	參數
`browser_file_upload`	上傳一個或多個文件	`paths`（數組）：要上傳的文件的絕對路徑。可以是單個文件或多個文件。
`browser_pdf_save`	將頁面保存為 PDF 文件	無

🔍 工具和實用程序

命令	描述	參數
`browser_close`	關閉當前窗口	無
`browser_wait`	等待指定的時間（秒）	`time`（數字）：要等待的秒數
`browser_resize`	調整瀏覽器窗口大小	`width`（數字）：瀏覽器窗口的寬度；`height`（數字）：瀏覽器窗口的高度
`browser_handle_dialog`	處理對話框	`accept`（布爾值）：是否接受對話框；`promptText`（字符串，可選）：提示對話框中的提示文本。