Konfigurasi

Matthias Rohmer

José Luis Zapata

Anda dapat mengonfigurasi Chrome DevTools untuk agen guna menyesuaikan cara interaksinya dengan browser, alat yang diaktifkan, dan cara penanganan data.

Konfigurasikan server dengan meneruskan flag command line dalam array args dari file konfigurasi klien Model Context Protocol (MCP) Anda. Ini biasanya 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 flag --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 flag --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 tidak dapat menggunakan --autoConnect (misalnya, di lingkungan dengan 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. Konfigurasikan agen Anda untuk terhubung ke port ini: json "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222"]

Mengizinkan akses file di luar direktori sementara

Alat yang membaca atau menulis file (misalnya, menyimpan screenshot, rekaman aktivitas, atau memuat ekstensi) hanya dapat mengakses jalur dalam root ruang kerja yang dikonfigurasi. Server menggunakan root yang disediakan klien MCP Anda melalui kemampuan root MCP, ditambah direktori apa pun yang Anda teruskan dengan --filesystemRoot (alias --workspace). Jika klien Anda tidak menyediakan root dan Anda tidak menetapkan --filesystemRoot, akses file akan dibatasi ke direktori sementara OS. Permintaan untuk jalur lain akan gagal dengan error Access denied: ... is not within any of the configured workspace roots.

Untuk mengizinkan akses ke direktori project, tambahkan --filesystemRoot ke argumen server Anda. Anda dapat mengulangi flag untuk mengizinkan beberapa direktori:

"args": ["chrome-devtools-mcp@latest", "--filesystemRoot=/path/to/project"]

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.

Opsi peluncuran browser

Opsi ini berlaku saat server MCP memulai Chrome.

Opsi keamanan dan privasi

Gunakan opsi ini untuk mengelola setelan keamanan dan privasi data.

Kategori fitur

Anda dapat mengaktifkan atau menonaktifkan grup alat menggunakan flag ini.

Opsi screenshot

Gunakan opsi ini untuk menyesuaikan cara agen mengambil screenshot.

Opsi eksperimental

Gunakan opsi ini untuk mengaktifkan fitur eksperimental yang sedang dikembangkan.

Opsi lain

Gunakan opsi ini untuk mengonfigurasi logging, pemilihan rute halaman, dan peta sumber, atau untuk mengaktifkan serangkaian alat yang disederhanakan.

Variabel lingkungan

Anda juga dapat menggunakan variabel lingkungan berikut untuk mengonfigurasi server:

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