Gemini CLI를 Chrome DevTools MCP에 연결하기

Gemini CLI가 Chrome을 조작할 수 있나요?

프로젝트에서 도구를 제공하고 계정과 승인 정책이 허용하면 가능합니다. Gemini CLI는 MCP 클라이언트입니다. Chrome DevTools MCP는 브라우저를 시작하거나 연결하고, URL 열기와 접근성 스냅샷 같은 도구를 제공합니다. 모델 인증과 브라우저 연결을 구분하세요. Connected가 보이면 이미 알고 있는 페이지로 브라우저 상태를 확인합니다. 예전 버전의 Gemini CLI에서는 다른 클라이언트가 연결한 MCP 서버에 접속하지 못했다는 제보가 있습니다. 같은 증상이 나타나면 먼저 연결 단계를 확인하세요. GitHub #178

Gemini CLI 확장 목록에도 Chrome DevTools MCP가 있습니다. 여기서는 버전과 실행 인수가 드러나는 프로젝트 설정을 사용합니다. Gemini CLI MCP 안내 Chrome DevTools 설정 브라우저의 Gemini

핵심 정리

• 프로젝트에 Chrome DevTools MCP를 등록하고 독립 프로필로 시작하세요.

• 연결은 gemini mcp list, 도구는 /mcp desc로 확인하세요.

• 도구가 반환한 최종 URL과 제목을 예상값과 비교하세요.

• 모델 인증, 작업공간 신뢰, 도구 승인을 따로 확인하세요.

검색과 브라우저 조작으로 확인하는 것

검색 결과로 공지를 찾을 수 있습니다. 탭의 계정이나 클릭 후 상태는 알 수 없습니다. 스냅샷은 현재 표시 내용을 보여 주지만 그 문서가 최신 공식 자료인지 판단하지 않습니다. 확인할 사실에 맞춰 도구를 선택하세요. 웹 검색과 브라우저 조작 AI 에이전트의 역할

작은 프로젝트에서 버전 고정하기

공식 문서를 바탕으로 만든 설정 예시입니다. Gemini CLI 0.67.0과 Chrome DevTools MCP 1.12.0을 사용합니다. Node.js와 Chrome 요구 사항을 확인하고 잠금 파일을 보관하세요. Chrome DevTools MCP v1.12.0

mkdir browser-mcp-check
cd browser-mcp-check
npm init -y
npm install --save-exact @google/gemini-cli@0.67.0 chrome-devtools-mcp@1.12.0
./node_modules/.bin/gemini --version
./node_modules/.bin/chrome-devtools-mcp --version

다음 서버를 프로젝트의 .gemini/settings.json에 추가하세요. 경로는 실제 로컬 실행 파일의 절대 경로로 바꿉니다. 이미 다른 설정이 있으면 서버 항목만 합칩니다.

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "/absolute/path/browser-mcp-check/node_modules/.bin/chrome-devtools-mcp",
      "args": ["--headless", "--isolated", "--no-usage-statistics"],
      "includeTools": ["new_page", "take_snapshot", "list_pages", "close_page"],
      "trust": false
    }
  }
}

includeTools는 Gemini CLI에 노출하는 도구를 제한하며 접속 도메인은 제한하지 않습니다. --isolated는 임시 프로필을 사용합니다. 직접 관리하거나 접근이 허가된 페이지에서 시작하세요. 기존 세션은 별도로 연결하고 계정을 확인합니다. Google Codelab은 전체 테스트 앱을 다룹니다. 최초 연결 점검은 제목과 링크를 아는 페이지 하나로 충분합니다. 기존 브라우저 연결 Google Codelab

작업공간을 신뢰하면 Gemini가 프로젝트 설정을 불러올 수 있습니다. trust: false에서는 도구 호출에 현재 정책이 적용됩니다. 대화 모드에서 시작하고 승인 요청이 나오면 서버 이름, 동작, URL을 확인하세요. 비대화 모드에서는 ask_user 규칙이 호출을 거부합니다. URL을 제한해야 한다면 Chrome DevTools MCP에서 별도로 설정하세요. --allowed-url-pattern 옵션에는 Chrome 149 이상이 필요합니다. Gemini CLI 정책 Chrome DevTools MCP 설정

연결을 확인한 뒤 실제 페이지 확인하기

프로젝트에서 ./node_modules/.bin/gemini mcp list를 실행하세요. 신뢰하는 작업공간에서는 프로젝트 설정을 불러올 수 있습니다. Gemini CLI 대화 화면에서 /mcp desc를 실행해 도구와 매개변수를 확인하세요. 모델 접근은 별도로 설정합니다. 인증 방법

같은 조건에서 다시 확인하려면 두 번째 터미널에서 테스트 프로젝트를 열고 로컬 페이지를 띄우세요. 제목은 “MCP browser check”이고 링크는 #details를 가리킵니다. 도구 결과에서 두 항목을 확인하세요.

mkdir -p fixture
cat > fixture/index.html <<'HTML'
<!doctype html>
<meta charset="utf-8">
<title>MCP browser check</title>
<h1>MCP browser check</h1>
<a href="#details">Details</a>
<p id="details">Local fixture</p>
HTML
python3 -m http.server 8765 --bind 127.0.0.1 --directory fixture

이 예시의 버전에서는 new_page가 반환한 ID를 pageId로 take_snapshot에 전달합니다. 리디렉션이 발생할 수 있으므로 실제 반환된 URL과 제목을 확인하세요. v1.12.0 도구 문서

chrome-devtools MCP로 http://127.0.0.1:8765/을 여세요. 페이지 ID, 최종 URL, 주요 제목과 예상 링크를 반환하세요. 받은 페이지 ID로 스냅샷을 읽습니다. 접근에 실패하면 오류를 알려 주세요. 로그인 정보를 입력하거나 제출, 변경하지 마세요.

오류가 난 단계 확인하기

등록에 실패하면 설정 범위, 버전과 전송을 점검하세요. 한 사용자는 이전 Gemini CLI에서 연결되지 않았지만 다른 클라이언트에서는 연결됐다고 보고했습니다. Apple Silicon을 쓰는 다른 사용자는 PATH의 Intel용 Node가 MCP 실행에 쓰인 것을 발견했습니다. 각각의 환경에서 생긴 일입니다. 설정을 바꾸기 전에 실행 파일과 아키텍처를 확인합니다. 원래 이슈 Reddit 원문

페이지가 열려도 스냅샷에 실패하면 스키마를 확인하고 응답의 페이지 ID를 사용하세요. 로그인 화면이 뜨면 작업을 중단하고 필요한 사용자 조치를 기록합니다. 로그인 세션 확인

재현할 수 있는 결과 남기기

CLI, 서버, 브라우저 버전, 설정 범위, 모드, 도구 목록, 최종 URL, 페이지 ID와 기대 결과를 저장합니다. 승인과 실패가 발생한 단계를 기록하면 다시 실행할 때 차이를 좁힐 수 있습니다. 첫 브라우저 작업 연결 방법 선택 에이전트 브라우저란

Gemini CLI에서 Chrome의 현재 상태가 필요하다면 프로젝트에 서버를 등록하고 결과를 아는 페이지부터 확인하세요. 도구를 하나씩 추가할 때도 확인 가능한 결과를 정하세요.

Secholar.L

Tabbit 그로스 & 콘텐츠

Secholar.L은 AI 브라우저와 에이전트 워크플로우에 대한 실용적인 가이드를 작성하며, 실제 조사와 검증 가능한 출처를 바탕으로 도구를 비교합니다.