Chrome DevTools MCP

適用於代理程式的 Chrome DevTools

Chrome DevTools for agents（chrome-devtools-mcp）讓你的程式碼代理程式（例如 Antigravity、Claude、Cursor 或 Copilot）能夠控制並檢查即時的 Chrome 瀏覽器。它作為 Model-Context-Protocol（MCP）伺服器，為你的 AI 程式碼輔助工具提供完整的 Chrome DevTools 功能，以實現可靠的自動化、深入的除錯和效能分析。同時也提供 CLI，供未使用 MCP 的情境使用。

工具參考 | 變更日誌 | 貢獻指南 | 疑難排解 | 設計原則

主要功能

• 取得效能洞察：使用 https://github.com/ChromeDevTools/devtools-frontend 記錄追蹤資料並提取可操作的效能洞察。
• 進階瀏覽器除錯：分析網路請求、擷取螢幕截圖，並檢查瀏覽器主控台訊息（含來源對應的堆疊追蹤）。
• 可靠的自動化：使用 puppeteer 在 Chrome 中自動執行操作，並自動等待操作結果。

免責聲明

chrome-devtools-mcp 會將瀏覽器實例的內容暴露給 MCP 用戶端，使其能夠檢查、除錯及修改瀏覽器或 DevTools 中的任何資料。請避免分享你不想與 MCP 用戶端共享的敏感或個人資訊。

chrome-devtools-mcp 僅正式支援 Google Chrome 和 Chrome for Testing。其他基於 Chromium 的瀏覽器可能可以運作，但不保證相容，且你可能會遇到非預期的行為。請自行斟酌使用。我們致力於為最新版本的 Extended Stable Chrome 提供修正和支援。

效能工具可能會將追蹤 URL 傳送至 Google CrUX API，以取得真實使用者體驗資料。這有助於透過呈現現場資料與實驗室資料，提供全面的效能概觀。此資料由 https://developer.chrome.com/docs/crux 收集。若要停用此功能，請使用 --no-performance-crux 旗標執行。

使用統計

Google 會收集使用統計資料（例如工具呼叫成功率、延遲和環境資訊），以改善 Chrome DevTools MCP 的可靠性和效能。

資料收集預設為啟用。你可以透過在啟動伺服器時傳入 --no-usage-statistics 旗標來選擇退出：

"args": ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]

Google 會依照 Google 隱私權政策 處理此資料。

Google 針對 Chrome DevTools MCP 收集使用統計資料，與 Chrome 瀏覽器的使用統計資料是獨立的。選擇退出 Chrome 指標並不會自動讓你退出此工具，反之亦然。

如果設定了 CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS 或 CI 環境變數，則會停用收集。

更新檢查

預設情況下，伺服器會定期檢查 npm 登錄檔以取得更新，並在發現較新版本時記錄通知。你可以透過設定 CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS 環境變數來停用這些更新檢查。

需求

• Node.js LTS 版本。
• Chrome 目前穩定版本或更新版本。
• npm

快速入門

將以下設定新增至你的 MCP 用戶端：

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest"]
    }
  }
}

[!NOTE] 使用 chrome-devtools-mcp@latest 可確保你的 MCP 用戶端永遠使用最新版本的 Chrome DevTools MCP 伺服器。

如果你只想執行基本的瀏覽器任務，請使用 --slim 模式：

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
    }
  }
}

請參閱 精簡工具參考。

MCP 用戶端設定

如需針對特定編輯器或代理程式（例如 Antigravity、Claude Code、Cursor、VS Code）的設定說明，請參閱我們的 用戶端設定指南。

你的第一個提示

在 MCP 用戶端中輸入以下提示，以檢查一切是否正常運作：

Check the performance of https://developers.chrome.com

你的 MCP 用戶端應會開啟瀏覽器並記錄效能追蹤。

[!NOTE] 一旦 MCP 用戶端使用需要執行中瀏覽器實例的工具，MCP 伺服器便會自動啟動瀏覽器。僅連線至 Chrome DevTools MCP 伺服器本身並不會自動啟動瀏覽器。

工具

如果你遇到任何問題，請查看我們的疑難排解指南。請參閱完整的工具參考，以取得所有受支援 MCP 功能的完整清單。

設定

在設定指南中，你可以找到完整的伺服器參數清單（例如 --headless、--isolated、--slim）以及如何設定 WebSocket 連線。

進階用法

如需進階功能，例如處理並行工作階段、持久化使用者資料目錄、連線至執行中的 Chrome 實例（而非啟動新實例），或在 Android 上進行除錯，請參閱我們的進階用法指南。

整合為瀏覽器子代理程式

如果你正在開發代理程式工具，並希望將整合式瀏覽器子代理程式作為產品的一部分，我們建議以 Chrome DevTools for agents 為基礎進行建置。

如需參考實作，請參閱 Gemini CLI 瀏覽器代理程式文件。