Konfigurasi

Matthias Rohmer
José Luis Zapata

Anda dapat mengonfigurasi Chrome DevTools agar agen dapat menyesuaikan cara berinteraksi dengan browser, alat yang diaktifkan, dan cara menangani data.

Konfigurasi server dengan meneruskan flag command line dalam array args dari file konfigurasi klien Model Context Protocol (MCP). Biasanya berupa file config.json.

Misalnya, untuk menjalankan Chrome dalam mode headless dan menggunakan saluran Canary, gunakan konfigurasi berikut:

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

Skenario konfigurasi umum

Skenario berikut menjelaskan cara umum untuk mengonfigurasi Chrome DevTools bagi agen.

Menjalankan dalam mode headless

Untuk melakukan tugas latar belakang tanpa jendela browser yang terlihat, jalankan Chrome dalam mode headless (tanpa UI). Tambahkan tanda --headless ke argumen server Anda.

Menghubungkan ke sesi browser yang ada

Secara default, DevTools untuk agen memulai instance Chrome baru. Namun, Anda dapat menghubungkan agen ke sesi browser yang ada. Hal ini berguna jika agen Anda perlu menyelidiki masalah dalam sesi yang telah Anda mulai (misalnya, jika Anda sudah login).

Anda dapat terhubung ke sesi yang ada dengan dua cara:

Koneksi otomatis (Chrome 144+)

Jika Anda menggunakan tanda --autoConnect, server MCP akan otomatis terhubung ke instance Chrome yang aktif.

  1. Di browser Chrome yang sedang berjalan, buka chrome://inspect/#remote-debugging dan aktifkan Proses Debug Jarak Jauh.
  2. Tambahkan --autoConnect ke konfigurasi MCP Anda: json "args": ["chrome-devtools-mcp@latest", "--autoConnect"]
  3. Saat agen mencoba terhubung, Chrome akan menampilkan dialog yang meminta izin. Klik Izinkan.

Koneksi manual

Jika Anda tidak dapat menggunakan --autoConnect (misalnya, di lingkungan sandbox), Anda dapat memulai Chrome secara manual dengan port proses debug dan terhubung menggunakan --browser-url.

  1. Mulai Chrome dari terminal dengan proses debug jarak jauh diaktifkan dan direktori data pengguna kustom.
    • macOS: shell /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable
    • Windows: shell start chrome --remote-debugging-port=9222 --user-data-dir=%TEMP%\chrome-profile-stable
    • Linux: shell google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable
  2. Konfigurasi agen Anda untuk terhubung ke port ini: json "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222"]

Referensi opsi konfigurasi

Bagian berikut mencantumkan flag konfigurasi yang tersedia. Untuk mengetahui opsi dan update terbaru, lihat repositori GitHub MCP Chrome DevTools.

Opsi koneksi

Gunakan opsi ini untuk mengonfigurasi cara server terhubung ke Chrome.

Bendera Jenis Default Deskripsi
--autoConnect atau --auto-connect boolean false Menghubungkan secara otomatis ke instance Chrome yang berjalan secara lokal (144+). Memerlukan pengaktifan proses debug jarak jauh menggunakan chrome://inspect/#remote-debugging.
--browserUrl atau --browser-url
-u		 string false Hubungkan ke instance Chrome yang berjalan dan dapat di-debug (misalnya, http://127.0.0.1:9222).
--wsEndpoint atau --ws-endpoint
-w		 string false Endpoint WebSocket untuk terhubung ke instance Chrome yang sedang berjalan (misalnya, ws://127.0.0.1:9222/devtools/browser/<id>). Alternatif untuk --browserUrl.
--wsHeaders atau --ws-headers string false Header kustom untuk koneksi WebSocket dalam format JSON (misalnya, '{"Authorization":"Bearer token"}'). Hanya berfungsi dengan --wsEndpoint.

Opsi peluncuran browser

Opsi ini berlaku saat server MCP memulai Chrome.

Bendera Jenis Default Deskripsi
--headless boolean false Menjalankan Chrome dalam mode headless (tanpa UI).
--channel string stable Menentukan saluran Chrome yang akan digunakan. Pilihan: canary, dev, beta, dan stable.
--executablePath atau --executable-path
-e		 string false Jalur ke file Chrome yang dapat dieksekusi kustom.
--userDataDir atau --user-data-dir string Lihat deskripsi Jalur ke direktori data pengguna. Default-nya adalah $HOME/.cache/chrome-devtools-mcp/chrome-profile$CHANNEL_SUFFIX_IF_NON_STABLE.
--isolated boolean false Membuat direktori data pengguna sementara yang otomatis dibersihkan saat browser ditutup.
--viewport string false Ukuran area pandang awal (misalnya, 1280x720). Dalam mode headless, ukuran maksimum adalah 3840x2160.
--proxyServer atau --proxy-server string false Konfigurasi server proxy diteruskan ke Chrome.
--chromeArg atau --chrome-arg array false Argumen tambahan untuk diteruskan ke Chrome.
--ignoreDefaultChromeArg atau --ignore-default-chrome-arg array false Nonaktifkan argumen default untuk Chrome secara eksplisit.

Opsi keamanan dan privasi

Gunakan opsi ini untuk mengelola setelan keamanan dan privasi data.

Bendera Jenis Default Deskripsi
--acceptInsecureCerts atau --accept-insecure-certs boolean false Mengabaikan error terkait sertifikat yang ditandatangani sendiri dan yang sudah habis masa berlakunya. Gunakan dengan hati-hati.
--blockedUrlPattern atau --blocked-url-pattern array false Membatasi akses jaringan dengan memblokir pola URL yang ditentukan (menggunakan URLPattern). Memblokir navigasi dan subresource.
--allowedUrlPattern atau --allowed-url-pattern array false Membatasi akses jaringan dengan hanya mengizinkan pola URL yang ditentukan. Memerlukan Chrome 149+.
--redactNetworkHeaders atau --redact-network-headers boolean false Menyamarkan header jaringan sensitif sebelum menampilkannya kembali ke klien.
--usageStatistics atau --usage-statistics boolean true Mengaktifkan pengumpulan statistik penggunaan untuk meningkatkan kualitas alat. Juga dapat dinonaktifkan menggunakan variabel lingkungan CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS atau CI.
--performanceCrux atau --performance-crux boolean true Mengirim URL dari rekaman aktivitas performa ke Google CrUX API untuk mengambil data pengalaman pengguna sebenarnya.

Kategori fitur

Anda dapat mengaktifkan atau menonaktifkan grup alat menggunakan tanda ini.

Bendera Jenis Default Deskripsi
--categoryEmulation atau --category-emulation boolean true Mengaktifkan alat yang terkait dengan emulasi.
--categoryNetwork atau --category-network boolean true Mengaktifkan alat yang terkait dengan jaringan.
--categoryPerformance atau --category-performance boolean true Mengaktifkan alat yang terkait dengan performa.
--categoryExtensions atau --category-extensions boolean false Mengaktifkan alat yang terkait dengan ekstensi. Hanya didukung dengan koneksi pipa.
--categoryExperimentalThirdParty atau --category-experimental-third-party boolean false Mengaktifkan alat developer pihak ketiga yang diekspos oleh halaman yang diperiksa.
--categoryExperimentalWebmcp atau --category-experimental-webmcp boolean false Mengaktifkan alat WebMCP proses debug. Memerlukan Chrome 149+ dengan fitur WebMCP diaktifkan.
--memoryDebugging atau --memory-debugging boolean false Mengaktifkan alat proses debug memori.

Opsi screenshot

Gunakan opsi ini untuk menyesuaikan cara agen mengambil screenshot.

Bendera Jenis Default Deskripsi
--screenshotFormat atau --screenshot-format string false Mengganti format output default (png). Pilihan: jpeg, png, dan webp. Format jpeg dan webp lebih kecil, yang membantu mengurangi ukuran konteks dalam percakapan AI.
--screenshotQuality atau --screenshot-quality angka false Mengganti kualitas kompresi (0-100) untuk jpeg dan webp.
--screenshotMaxWidth atau --screenshot-max-width angka false Lebar maksimum dalam piksel. Screenshot yang lebih besar akan diperkecil.
--screenshotMaxHeight atau --screenshot-max-height angka false Tinggi maksimum dalam piksel. Screenshot yang lebih besar akan diperkecil.

Opsi eksperimental

Gunakan opsi ini untuk mengaktifkan fitur eksperimental yang sedang dalam pengembangan.

Bendera Jenis Default Deskripsi
--experimentalPageIdRouting atau --experimental-page-id-routing boolean false Mengekspos pageId di alat cakupan halaman untuk merutekan permintaan dalam sesi agen serentak.
--experimentalDevtools atau --experimental-devtools boolean false Mengaktifkan otomatisasi melalui target DevTools.
--experimentalVision atau --experimental-vision boolean false Mengaktifkan alat berbasis koordinat (misalnya, click_at). Biasanya memerlukan model penggunaan komputer yang dapat menghasilkan koordinat akurat dengan melihat screenshot.
--experimentalStructuredContent atau --experimental-structured-content boolean false Menghasilkan konten yang diformat terstruktur.
--experimentalIncludeAllPages atau --experimental-include-all-pages boolean false Mencakup semua jenis halaman (misalnya, webview dan halaman latar belakang).
--experimentalScreencast atau --experimental-screencast boolean false Mengekspos alat screencast (memerlukan ffmpeg di PATH).
--experimentalFfmpegPath atau --experimental-ffmpeg-path string false Jalur ke file yang dapat dieksekusi ffmpeg.

Opsi lain

Gunakan opsi ini untuk mengonfigurasi logging atau mengaktifkan serangkaian alat yang disederhanakan.

Bendera Jenis Default Deskripsi
--slim boolean false Mengekspos tiga alat yang sederhana (navigasi, eksekusi skrip, dan screenshot). Berguna untuk tugas browser dasar.
--logFile atau --log-file string false Jalur ke file untuk menulis log debug.

Variabel lingkungan

Anda juga dapat menggunakan variabel lingkungan berikut untuk mengonfigurasi server:

  • CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS: Jika disetel, akan menonaktifkan pengumpulan statistik penggunaan (setara dengan --no-usage-statistics).
  • CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS: Jika disetel, menonaktifkan pemeriksaan berkala untuk update.
  • CI: Jika disetel, akan menonaktifkan pengumpulan statistik penggunaan.
  • DEBUG: Tetapkan ke * untuk mengaktifkan logging debug panjang (berfungsi bersama dengan --logFile).