mcp MCP — 사용 사례, 설치 & 라이브 데모

왜 쓰나요

핵심 기능

Drives your existing Chrome profile — already-logged-in sessions work
Local — no external browser automation service
Uses real browser fingerprint; sidesteps most bot detection
Free (Chrome extension + local MCP)

라이브 데모

실제 사용 모습

mcp.replay ▶ 준비됨

0/0

설치

클라이언트 선택

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

{
  "mcpServers": {
    "mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp"
      ],
      "_inferred": true
    }
  }
}

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

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

{
  "mcpServers": {
    "mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp"
      ],
      "_inferred": true
    }
  }
}

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

VS Code → Cline → MCP Servers → Edit

{
  "mcpServers": {
    "mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp"
      ],
      "_inferred": true
    }
  }
}

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

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp"
      ],
      "_inferred": true
    }
  }
}

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

~/.continue/config.json

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

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

~/.config/zed/settings.json

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

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

claude mcp add mcp -- npx -y mcp

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

사용 사례

실전 활용법: mcp

Automate tasks behind your real web logins (Gmail, admin panels)

👤 Productivity power users, ops ⏱ ~15 min intermediate

언제 쓸까: A service has no API and you're logged in via SSO — you want Claude to do repetitive work in that tab.

사전 조건

Chrome + Browser MCP extension installed — docs.browsermcp.io → install extension

흐름

Grant the extension access to the target tab

Open the admin panel tab, click the Browser MCP extension icon, allow this tab.✓ 복사됨

→ Extension shows 'connected'
Delegate a task

In the admin panel: find the user with email X, change their plan to 'Pro', take a screenshot of the confirmation.✓ 복사됨

→ Task completes with visual proof

결과: Repetitive admin actions done via chat, with zero API integration work.

함정

Running actions you didn't mean — this is YOUR real account — Be precise in prompts; the MCP doesn't undo. Test on staging accounts first

Extract data from sites that block headless scrapers

👤 Researchers, analysts ⏱ ~15 min intermediate

언제 쓸까: A site you're allowed to read programmatically blocks Playwright/Selenium fingerprints.

흐름

Navigate manually first if needed

Browser MCP uses your open tabs; navigate to the target, then ask me to read it✓ 복사됨

→ Correct tab is active
Extract structured data

Read the results table on this page and return as JSON with columns [name, date, value]✓ 복사됨

→ Structured data

결과: Data you couldn't get with headless tools, obtained via your normal browser session.

함정

Using this to scrape at scale against a site's ToS — Stay within rate limits a human would generate; respect robots.txt

함께 쓰기: filesystem

Reproduce a user bug in your real browser

👤 Support engineers ⏱ ~10 min beginner

언제 쓸까: A customer reports a bug; you want to replicate their exact click path in your own logged-in session to see.

흐름

Replay the reported steps

Reproduce this user's flow in the app tab: login → Settings → toggle X → save. Report what happens and any console errors.✓ 복사됨

→ Reproduction result with errors

결과: Faster support triage than video back-and-forth.

함께 쓰기: sentry

조합

다른 MCP와 조합해 10배 효율

mcp + filesystem

Save scraped data to disk

Extract the table on this page and save as ./exports/{hostname}-{date}.csv.✓ 복사됨

mcp + sentry

Reproduce a user bug tied to a Sentry event

Sentry event XYZ shows breadcrumbs [open, click, save]. Replay them in my current tab and compare the result.✓ 복사됨

도구

이 MCP가 노출하는 것

도구	입력	언제 호출
browser_navigate	url: str	Move the current tab
browser_snapshot		See structured page content
browser_click	ref or selector	Click elements
browser_type	ref, text	Fill inputs
browser_screenshot	fullPage?	Capture state

비용 및 제한

운영 비용

API 쿼터: None — local
호출당 토큰: Snapshots 500-3000
금액: Free
팁: Prefer snapshot-based refs over screenshots for action — cheaper and more reliable

보안

권한, 시크릿, 파급범위

자격 증명 저장: Uses your real browser's cookies — these are as sensitive as your sessions

데이터 외부 송신: Tabs connect to whatever you navigate to; no telemetry

문제 해결

자주 발생하는 오류와 해결

Extension shows 'not connected'

Click the extension icon in the target tab and allow; the connection is per-tab

확인: Badge shows green

Actions do nothing on an SPA

Take a snapshot first — SPAs often need a wait before elements are interactive

Site detected automation anyway

Rare — disable other extensions that modify navigator properties; restart browser

대안

mcp 다른 것과 비교

대안	언제 쓰나	단점/장점
Playwright MCP	You want hermetic, scriptable, CI-friendly browser automation	No real-session access; more bot-detectable
Puppeteer MCP	Chromium-only headless control	Same tradeoffs as Playwright, smaller surface

mcp