設定

您可以為代理程式設定 Chrome 開發人員工具,自訂與瀏覽器的互動方式、啟用的工具,以及資料處理方式。

在 Model Context Protocol (MCP) 用戶端設定檔的 args 陣列中傳遞指令列標記,藉此設定伺服器。這通常是 config.json 檔案。

舉例來說,如要在無頭模式下執行 Chrome 並使用 Canary 版,請使用下列設定:

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

常見設定情境

下列情境說明如何為代理程式設定 Chrome 開發人員工具。

以無頭模式執行

如要在沒有可見瀏覽器視窗的情況下執行背景工作,請以無頭 (無 UI) 模式執行 Chrome。在伺服器引數中新增 --headless 旗標。

連線至現有的瀏覽器工作階段

根據預設,代理專用開發人員工具會啟動新的 Chrome 執行個體。不過,您可以將代理程式連結至現有的瀏覽器工作階段。如果您已啟動工作階段,但服務專員需要調查問題 (例如您已登入),這個方法就十分實用。

您可以透過下列兩種方式連線至現有工作階段:

自動連線 (Chrome 144 以上版本)

如果您使用 --autoConnect 旗標,MCP 伺服器會自動連線至有效的 Chrome 執行個體。

  1. 在執行中的 Chrome 瀏覽器中,前往 chrome://inspect/#remote-debugging 並啟用「遠端偵錯」
  2. 在 MCP 設定中加入 --autoConnectjson "args": ["chrome-devtools-mcp@latest", "--autoConnect"]
  3. 當服務專員嘗試連線時,Chrome 會顯示要求授權的對話方塊。按一下「允許」

手動連線

如果無法使用 --autoConnect (例如在沙箱環境中),可以手動啟動 Chrome 並指定偵錯連接埠,然後使用 --browser-url 連線。

  1. 從終端機啟動 Chrome,並啟用遠端偵錯功能和自訂使用者資料目錄。
    • macOSshell /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable
    • Windowsshell start chrome --remote-debugging-port=9222 --user-data-dir=%TEMP%\chrome-profile-stable
    • Linuxshell google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable
  2. 設定代理程式,連線至這個通訊埠: json "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222"]

設定選項參考資料

以下各節列出可用的設定標記。如要瞭解最新選項和更新,請參閱 Chrome 開發人員工具 MCP GitHub 存放區

連線選項

使用這些選項設定伺服器連線至 Chrome 的方式。

檢舉 類型 預設 說明
--autoConnect--auto-connect 布林值 false 自動連線至在本機執行的 Chrome (144 以上版本) 執行個體。必須使用 chrome://inspect/#remote-debugging 啟用遠端偵錯功能。
--browserUrl--browser-url
-u
字串 false 連線至可偵錯的執行中 Chrome 執行個體 (例如 http://127.0.0.1:9222)。
--wsEndpoint--ws-endpoint
-w
字串 false 用於連線至執行中 Chrome 執行個體的 WebSocket 端點 (例如 ws://127.0.0.1:9222/devtools/browser/<id>)。這是 --browserUrl 的替代方案。
--wsHeaders--ws-headers 字串 false JSON 格式的 WebSocket 連線自訂標頭 (例如 '{"Authorization":"Bearer token"}')。僅適用於 --wsEndpoint

瀏覽器啟動選項

這些選項會在 MCP 伺服器啟動 Chrome 時套用。

檢舉 類型 預設 說明
--headless 布林值 false 以無頭 (無 UI) 模式執行 Chrome。
--channel 字串 stable 指定要使用的 Chrome 管道。選項:canarydevbetastable
--executablePath--executable-path
-e
字串 false 自訂 Chrome 執行檔的路徑。
--userDataDir--user-data-dir 字串 查看說明 使用者資料目錄的路徑。預設值為 $HOME/.cache/chrome-devtools-mcp/chrome-profile$CHANNEL_SUFFIX_IF_NON_STABLE
--isolated 布林值 false 建立臨時使用者資料目錄,瀏覽器關閉時會自動清除。
--viewport 字串 false 初始可視區域大小 (例如 1280x720)。在無頭模式中,最大尺寸為 3840x2160
--proxyServer--proxy-server 字串 false 傳遞至 Chrome 的 Proxy 伺服器設定。
--chromeArg--chrome-arg 陣列 false 要傳送至 Chrome 的其他引數。
--ignoreDefaultChromeArg--ignore-default-chrome-arg 陣列 false 明確停用 Chrome 的預設引數。

安全性與隱私權選項

使用這些選項管理安全性設定和資料隱私權。

檢舉 類型 預設 說明
--acceptInsecureCerts--accept-insecure-certs 布林值 false 忽略與自行簽署和過期憑證相關的錯誤。請謹慎使用。
--blockedUrlPattern--blocked-url-pattern 陣列 false 封鎖指定的網址模式 (使用 URLPattern),限制網路存取權。封鎖導覽和子資源。
--allowedUrlPattern--allowed-url-pattern 陣列 false 僅允許特定網址模式,藉此限制網路存取權。必須使用 Chrome 149 以上版本。
--redactNetworkHeaders--redact-network-headers 布林值 false 先遮蓋敏感的網路標頭,再傳回用戶端。
--usageStatistics--usage-statistics 布林值 true 啟用使用統計資料收集功能,以利改善工具。您也可以使用 CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICSCI 環境變數停用這項功能。
--performanceCrux--performance-crux 布林值 true 將效能追蹤記錄中的網址傳送至 Google CrUX API,以擷取實際使用者體驗資料。

功能類別

您可以使用這些標記啟用或停用工具群組。

檢舉 類型 預設 說明
--categoryEmulation--category-emulation 布林值 true 啟用與模擬相關的工具。
--categoryNetwork--category-network 布林值 true 啟用網路相關工具。
--categoryPerformance--category-performance 布林值 true 啟用與成效相關的工具。
--categoryExtensions--category-extensions 布林值 false 啟用擴充功能相關工具。僅支援管道連線。
--categoryExperimentalThirdParty--category-experimental-third-party 布林值 false 啟用檢查頁面公開的第三方開發人員工具
--categoryExperimentalWebmcp--category-experimental-webmcp 布林值 false 啟用 WebMCP 工具的偵錯功能。必須使用 Chrome 149 以上版本,並啟用 WebMCP 功能。
--memoryDebugging--memory-debugging 布林值 false 啟用記憶體偵錯工具。

螢幕截圖選項

使用這些選項自訂代理程式擷取螢幕截圖的方式。

檢舉 類型 預設 說明
--screenshotFormat--screenshot-format 字串 false 覆寫預設輸出格式 (png)。選項:jpegpngwebpjpegwebp 格式較小,有助於縮減 AI 對話中的脈絡大小。
--screenshotQuality--screenshot-quality 數字 false 覆寫 jpegwebp 的壓縮品質 (0 到 100)。
--screenshotMaxWidth--screenshot-max-width 數字 false 寬度上限 (以像素為單位)。較大的螢幕截圖會縮小。
--screenshotMaxHeight--screenshot-max-height 數字 false 高度上限 (以像素為單位)。較大的螢幕截圖會縮小。

實驗選項

使用這些選項可啟用開發中的實驗功能。

檢舉 類型 預設 說明
--experimentalPageIdRouting--experimental-page-id-routing 布林值 false 在頁面範圍工具中公開 pageId,以便在並行代理程式工作階段中傳送要求。
--experimentalDevtools--experimental-devtools 布林值 false 啟用開發人員工具目標的自動化作業。
--experimentalVision--experimental-vision 布林值 false 啟用以座標為基礎的工具 (例如 click_at)。通常需要電腦使用模型,才能透過查看螢幕截圖產生準確的座標。
--experimentalStructuredContent--experimental-structured-content 布林值 false 輸出結構化格式的內容。
--experimentalIncludeAllPages--experimental-include-all-pages 布林值 false 包括所有類型的網頁 (例如網頁檢視區塊和背景網頁)。
--experimentalScreencast--experimental-screencast 布林值 false 公開螢幕側錄工具 (PATH 中必須有 ffmpeg)。
--experimentalFfmpegPath--experimental-ffmpeg-path 字串 false ffmpeg 可執行檔的路徑。

其他選項

使用這些選項設定記錄功能,或啟用簡化的工具組合。

檢舉 類型 預設 說明
--slim 布林值 false 提供一組精簡的三種工具 (導覽、指令碼執行和螢幕截圖)。適合用於基本瀏覽器工作。
--logFile--log-file 字串 false 要寫入偵錯記錄的檔案路徑。

環境變數

您也可以使用下列環境變數設定伺服器:

  • CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS:如果設定這個屬性,系統會停用使用情形統計資料收集功能 (等同於 --no-usage-statistics)。
  • CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS:如果設定,系統會停用定期檢查更新。
  • CI:如果設定,系統會停用使用統計資料收集功能。
  • DEBUG:設為 * 可啟用詳細偵錯記錄 (與 --logFile 搭配使用)。