Chrome MCP

왜 쓰나요

핵심 기능

로그인한 Chrome 사용 — OAuth 댄스 없음, 봇 감지 없음
열려 있는 모든 탭에 대한 의미 검색
전체 DOM 추출 + 스크린샷 도구
극작가/인형극을 차단하는 사이트에서 작동합니다.
로컬 — 클라우드 미들웨어 없음

라이브 데모

실제 사용 모습

mcp-chrome.replay ▶ 준비됨

0/0

설치

클라이언트 선택

~/Library/Application Support/Claude/claude_desktop_config.json · Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Claude Desktop → Settings → Developer → Edit Config 열기. 저장 후 앱 재시작.

~/.cursor/mcp.json · .cursor/mcp.json

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Cursor는 Claude Desktop과 동일한 mcpServers 스키마 사용. 프로젝트 설정이 전역보다 우선.

VS Code → Cline → MCP Servers → Edit

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Cline 사이드바의 MCP Servers 아이콘 클릭 후 "Edit Configuration" 선택.

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "mcp-chrome": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  }
}

Claude Desktop과 같은 형식. Windsurf 재시작 후 적용.

~/.continue/config.json

{
  "mcpServers": [
    {
      "name": "mcp-chrome",
      "command": "npx",
      "args": [
        "-y",
        "mcp-chrome-bridge"
      ]
    }
  ]
}

Continue는 맵이 아닌 서버 오브젝트 배열 사용.

~/.config/zed/settings.json

{
  "context_servers": {
    "mcp-chrome": {
      "command": {
        "path": "npx",
        "args": [
          "-y",
          "mcp-chrome-bridge"
        ]
      }
    }
  }
}

context_servers에 추가. 저장 시 Zed가 핫 리로드.

claude mcp add mcp-chrome -- npx -y mcp-chrome-bridge

한 줄 명령. claude mcp list로 확인, claude mcp remove로 제거.

사용 사례

실전 활용법: Chrome MCP

Claude에게 비밀번호를 건네주지 않고 로그인이 필요한 사이트를 조사하세요.

👤 구독 콘텐츠를 이용하는 연구원, 분석가 ⏱ ~20 min beginner

언제 쓸까: 페이월 사이트 또는 제한 대시보드에 로그인했으며 Claude가 이를 읽어주기를 원합니다.

사전 조건

Chrome 확장 프로그램이 설치되었습니다. — Chrome 웹 스토어에서 설치하세요. 브리지 MCP가 자동 연결됩니다.
대상 사이트가 이미 Chrome에서 열려 있고 인증되었습니다. — 먼저 일반 탭에서 수동으로 로그인하세요.

흐름

탭 확인

List my open Chrome tabs.✓ 복사됨

→ Tab titles + URLs for every active tab
발췌

From the Bloomberg tab, extract the article body and the sidebar data table.✓ 복사됨

→ Structured content pulled; no "cannot access" error
크로스탭 합성

Across the 3 research-provider tabs I have open, what's the consensus view on X?✓ 복사됨

→ Synthesis with per-tab citations

결과: 실제 인증된 콘텐츠를 바탕으로 답변을 제공하며 로그인 페이지를 스크랩하지 않습니다.

함정

Session expires mid-task — Extension surfaces a refresh prompt; reauth in that tab and retry

함께 쓰기: 메모리

개발 빌드의 흐름을 스크린샷하여 UI 회귀를 포착하세요.

👤 프론트엔드 엔지니어 ⏱ ~30 min intermediate

언제 쓸까: 방금 CSS 리팩터링을 출시했고 10개 핵심 페이지의 시각적 차이점을 원합니다.

흐름

기준선 열기

Open my dev site pages listed in /qa/flows.json and screenshot each into /screenshots/before/.✓ 복사됨

→ Screenshots captured with filenames matching URLs
비교하다

After I deploy, take fresh screenshots and diff against /screenshots/before/. Summarize visual changes per page.✓ 복사됨

→ Per-page diff report with concrete observations

결과: 실제 브라우저 환경을 사용하여 5분 안에 시각적 회귀 보고서를 작성합니다.

함정

Screenshots differ due to font loading — Add a sleep or wait_for_selector step before capturing

함께 쓰기: 파일 시스템

조합

다른 MCP와 조합해 10배 효율

mcp-chrome + filesystem

Save extracted pages to disk for later indexing

이 탭을 추출하여 /research/ai-paper-notes.md에 작성하세요.✓ 복사됨

mcp-chrome + memory

Remember key findings across browsing sessions

오늘 읽은 내용을 요약해서 기억해 두세요.✓ 복사됨

도구

이 MCP가 노출하는 것

도구	입력	언제 호출	비용
list_tabs	none	세션을 시작하여 사용 가능한 내용 확인	free
read_tab	tab_id: int	특정 탭에서 콘텐츠 가져오기	free
click	tab_id, selector: str	페이지 요소와 상호 작용	free
screenshot	tab_id, full_page?: bool	비교 또는 검토를 위한 시각적 캡처	free
search_tabs	query: str	X에 대해 설명하는 탭 찾기	free

비용 및 제한

운영 비용

API 쿼터: 지역 — 무제한
호출당 토큰: DOM 추출은 용량이 클 수 있습니다. 5,000~50,000개 토큰
금액: Free
팁: 전체 DOM을 가져오는 대신 범위 추출을 위해 선택기와 함께 'read_tab'을 사용하세요.

보안

권한, 시크릿, 파급범위

최소 스코프: chrome.tabs chrome.scripting

자격 증명 저장: 없음 - Chrome에서 세션을 보유합니다.

데이터 외부 송신: 탭 내용은 MCP 클라이언트를 통해 LLM 공급자로 흐릅니다.

절대 부여 금지: access to incognito without reason

확장 프로그램은 설계상 광범위한 액세스를 제공합니다. 공식 Chrome 웹 스토어 목록에서만 설치하세요.

문제 해결

자주 발생하는 오류와 해결

확장 프로그램이 감지되지 않았습니다.

확장 프로그램을 고정하세요. 브리지 바이너리에는 확장 폴링이 필요합니다.

확인: chrome://extensions shows it enabled

탭 내용이 비어 있습니다.

페이지가 Shadow DOM을 사용할 수 있습니다. include_shadow=true로 read_tab을 시도해 보세요.

클릭수가 등록되지 않음

사이트는 자동화 방지(Cloudflare 등)를 사용합니다. 먼저 스크롤하여 지연 로드를 실행해 보세요.

대안

Chrome MCP 다른 것과 비교

대안	언제 쓰나	단점/장점
chrome-devtools MCP	사용자 자동화가 아닌 devtools 프로토콜(콘솔, 네트워크, 성능)을 원합니다.	DevTools MCP는 UI를 구동하지 않고 검사합니다.
playwright MCP	CI에서 헤드리스 자동화를 원합니다.	인증 상태가 없습니다. 봇 감지 경향