구성

에이전트용 Chrome DevTools를 구성하여 브라우저와 상호작용하는 방식, 사용 설정된 도구, 데이터 처리 방식을 맞춤설정할 수 있습니다.

모델 컨텍스트 프로토콜 (MCP) 클라이언트 구성 파일의 args 배열에서 명령줄 플래그를 전달하여 서버를 구성합니다. 일반적으로 config.json 파일입니다.

예를 들어 헤드리스 모드에서 Chrome을 실행하고 Canary 채널을 사용하려면 다음 구성을 사용하세요.

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

일반적인 구성 시나리오

다음 시나리오에서는 에이전트용 Chrome DevTools를 구성하는 일반적인 방법을 설명합니다.

헤드리스 모드에서 실행

표시되는 브라우저 창 없이 백그라운드 작업을 실행하려면 헤드리스 (UI 없음) 모드에서 Chrome을 실행합니다. 서버 인수에 --headless 플래그를 추가합니다.

기존 브라우저 세션에 연결

기본적으로 에이전트용 DevTools는 새 Chrome 인스턴스를 시작합니다. 하지만 에이전트를 기존 브라우저 세션에 연결할 수 있습니다. 이는 에이전트가 이미 시작한 세션에서 문제를 조사해야 하는 경우에 유용합니다 (예: 이미 로그인한 경우).

기존 세션에 연결하는 방법은 두 가지입니다.

자동 연결 (Chrome 144 이상)

--autoConnect 플래그를 사용하면 MCP 서버가 활성 Chrome 인스턴스에 자동으로 연결됩니다.

  1. 실행 중인 Chrome 브라우저에서 chrome://inspect/#remote-debugging으로 이동하고 원격 디버깅 을 사용 설정합니다.
  2. MCP 구성에 --autoConnect를 추가합니다. json "args": ["chrome-devtools-mcp@latest", "--autoConnect"]
  3. 에이전트가 연결을 시도하면 Chrome에서 권한을 요청하는 대화상자가 표시됩니다. 허용 을 클릭합니다.

수동 연결

샌드박스 환경과 같이 --autoConnect를 사용할 수 없는 경우 디버깅 포트를 사용하여 Chrome을 수동으로 시작하고 --browser-url을 사용하여 연결할 수 있습니다.

  1. 원격 디버깅이 사용 설정되고 맞춤 사용자 데이터 디렉터리가 있는 터미널에서 Chrome을 시작합니다.
    • 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. 이 포트에 연결하도록 에이전트를 구성합니다. json "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222"]

구성 옵션 참조

다음 섹션에서는 사용 가능한 구성 플래그를 보여줍니다. 최신 옵션 및 업데이트는 Chrome DevTools 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 채널을 지정합니다. 선택사항: canary, dev, beta, stable
--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에 전달되는 프록시 서버 구성입니다.
--chromeArg 또는 --chrome-arg 배열 false Chrome에 전달할 추가 인수입니다.
--ignoreDefaultChromeArg 또는 --ignore-default-chrome-arg 배열 false Chrome의 기본 인수를 명시적으로 사용 중지합니다.

보안 및 개인 정보 보호 옵션

이러한 옵션을 사용하여 보안 설정 및 데이터 개인 정보 보호를 관리합니다.

플래그 유형 기본값 설명
--acceptInsecureCerts 또는 --accept-insecure-certs 부울 false 자가 서명된 인증서 및 만료된 인증서와 관련된 오류를 무시합니다. 주의해서 사용하세요.
--blockedUrlPattern 또는 --blocked-url-pattern 배열 false 지정된 URL 패턴을 차단하여 네트워크 액세스를 제한합니다 (URLPattern 사용). 탐색 및 하위 리소스를 차단합니다.
--allowedUrlPattern 또는 --allowed-url-pattern 배열 false 지정된 URL 패턴만 허용하여 네트워크 액세스를 제한합니다. Chrome 149 이상이 필요합니다.
--redactNetworkHeaders 또는 --redact-network-headers 부울 false 민감한 네트워크 헤더를 클라이언트에 반환하기 전에 수정합니다.
--usageStatistics 또는 --usage-statistics 부울 true 도구를 개선하기 위해 사용 통계 수집을 사용 설정합니다. CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS 또는 CI 환경 변수를 사용하여 사용 중지할 수도 있습니다.
--performanceCrux 또는 --performance-crux 부울 true 실제 사용자 환경 데이터를 가져오기 위해 성능 트레이스에서 Google CrUX API로 URL을 보냅니다.

기능 카테고리

이러한 플래그를 사용하여 도구 그룹을 사용 설정하거나 사용 중지할 수 있습니다.

플래그 유형 기본값 설명
--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 도구 디버깅을 사용 설정합니다. WebMCP 기능이 사용 설정된 Chrome 149 이상이 필요합니다.
--memoryDebugging 또는 --memory-debugging 부울 false 메모리 디버깅 도구를 사용 설정합니다.

스크린샷 옵션

이러한 옵션을 사용하여 에이전트가 스크린샷을 캡처하는 방식을 맞춤설정합니다.

플래그 유형 기본값 설명
--screenshotFormat 또는 --screenshot-format 문자열 false 기본 출력 형식 (png)을 재정의합니다. 선택사항: jpeg, png, webp jpegwebp 형식은 더 작으므로 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 DevTools 타겟에 대한 자동화를 사용 설정합니다.
--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과 함께 작동).