Configurazione

Matthias Rohmer

José Luis Zapata

Puoi configurare Chrome DevTools per gli agenti in modo da personalizzare il modo in cui interagisce con il browser, quali strumenti sono attivati e come gestisce i dati.

Configura il server passando i flag della riga di comando nell'array args del file di configurazione del client Model Context Protocol (MCP). In genere si tratta del file config.json.

Ad esempio, per eseguire Chrome in modalità headless e utilizzare il canale Canary, utilizza la seguente configurazione:

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

Scenari di configurazione comuni

I seguenti scenari descrivono i modi più comuni per configurare Chrome DevTools per gli agenti.

Esegui in modalità headless

Per eseguire attività in background senza una finestra del browser visibile, esegui Chrome in modalità headless (senza UI). Aggiungi il flag --headless agli argomenti del server.

Connettiti a una sessione del browser esistente

Per impostazione predefinita, DevTools per agenti avvia una nuova istanza di Chrome. Tuttavia, puoi connettere l'agente a una sessione del browser esistente. Ciò è utile se l'agente deve esaminare un problema in una sessione che hai già avviato (ad esempio, se hai già eseguito l'accesso).

Puoi connetterti a una sessione esistente in due modi:

Connessione automatica (Chrome 144+)

Se utilizzi il flag --autoConnect, il server MCP si connette automaticamente a un'istanza di Chrome attiva.

1. Nel browser Chrome in esecuzione, vai a chrome://inspect/#remote-debugging e attiva Debug remoto.
2. Aggiungi --autoConnect alla configurazione MCP: json "args": ["chrome-devtools-mcp@latest", "--autoConnect"]
3. Quando l'agente tenta di connettersi, Chrome mostra una finestra di dialogo che richiede l'autorizzazione. Fai clic su Consenti.

Connessione manuale

Se non puoi utilizzare --autoConnect (ad esempio, in un ambiente sandbox), puoi avviare manualmente Chrome con una porta di debug e connetterti utilizzando --browser-url.

1. Avvia Chrome dal terminale con il debug remoto attivato e una directory dei dati utente personalizzata.
   • 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. Configura l'agente per la connessione a questa porta: json "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222"]

Consenti l'accesso ai file al di fuori della directory temporanea

Gli strumenti che leggono o scrivono file (ad esempio il salvataggio di screenshot, tracce o il caricamento di estensioni) possono accedere solo ai percorsi all'interno delle radici dello spazio di lavoro configurato. Il server utilizza le root fornite dal client MCP tramite la funzionalità delle root MCP, oltre a tutte le directory passate con --filesystemRoot (alias --workspace). Se il client non fornisce root e non imposti --filesystemRoot, l'accesso ai file è limitato alla directory temporanea del sistema operativo. Le richieste per altri percorsi non vanno a buon fine e restituiscono un errore Access denied: ... is not within any of the configured workspace roots.

Per consentire l'accesso a una directory di progetto, aggiungi --filesystemRoot agli argomenti del server. Puoi ripetere il flag per consentire più directory:

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

Riferimento alle opzioni di configurazione

Le sezioni seguenti elencano i flag di configurazione disponibili. Per le opzioni e gli aggiornamenti più recenti, consulta il repository GitHub di Chrome DevTools MCP.

Opzioni di connessione

Utilizza queste opzioni per configurare la modalità di connessione del server a Chrome.

Opzioni di avvio del browser

Queste opzioni si applicano quando il server MCP avvia Chrome.

Opzioni di sicurezza e privacy

Utilizza queste opzioni per gestire le impostazioni di sicurezza e la privacy dei dati.

Categorie di funzionalità

Puoi attivare o disattivare gruppi di strumenti utilizzando questi flag.

Opzioni degli screenshot

Utilizza queste opzioni per personalizzare il modo in cui l'agente acquisisce gli screenshot.

Opzioni sperimentali

Utilizza queste opzioni per attivare le funzionalità sperimentali in fase di sviluppo.

Altre opzioni

Utilizza queste opzioni per configurare il logging, il routing delle pagine e le mappe di origine o per attivare un insieme semplificato di strumenti.

Variabili di ambiente

Puoi anche utilizzare le seguenti variabili di ambiente per configurare il server:

• CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS: se impostato, disattiva la raccolta delle statistiche sull'utilizzo (equivalente a --no-usage-statistics).
• CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS: se impostato, disattiva i controlli periodici degli aggiornamenti.
• CI: se impostato, disattiva la raccolta delle statistiche sull'utilizzo.
• NODE_DEBUG: imposta su * per attivare il logging di debug dettagliato (funziona in combinazione con --logFile).