Cursor를 CDP로 실제 브라우저에 연결하는 방법 — Clawbrowser 블로그 커버 이미지

Cursor를 CDP로 실제 브라우저에 연결하는 방법

Clawbrowser Teamai-agentscdpcursortutorial

Cursor의 내장 browser tool은 로컬 앱을 확인할 때 편합니다. 페이지를 열고, 클릭하고, 입력하고, screenshot을 찍을 수 있습니다. 하지만 실제 웹사이트를 상대하면 격리된 webview라는 한계가 드러납니다. cookie가 오래 유지되지 않고, fingerprint가 관리되지 않으며, anti-bot 시스템이 보는 browser identity도 일관되지 않습니다.

요약: Cursor를 CDP(Chrome DevTools Protocol)로 Clawbrowser에 연결합니다. 그러면 agent는 실제 Chromium, persistent profile, managed fingerprint, proxy routing을 사용합니다. runtime 설치, profile 시작, local endpoint 연결이면 충분합니다.


Cursor 내장 브라우저만으로 부족한 이유

Cursor는 MCP server extension으로 동작하는 sandboxed webview 기반 browser tool을 제공합니다. localhost에서는 충분합니다. navigate, click, type, scroll, screenshot, console output, network traffic을 처리할 수 있습니다.

하지만 로컬 밖에서는 다음 제약이 생깁니다.

한계 발생하는 일
Sandboxed webview 실제 Chromium instance가 아닙니다. 사이트가 누락된 API와 비표준 window properties를 볼 수 있습니다.
Session persistence 없음 Cookies와 localStorage가 workspace에 묶이고 실행 사이에 안정적으로 유지되지 않습니다.
Fingerprint management 없음 canvas hash, WebGL renderer, navigator properties가 매번 거의 동일하게 보입니다.
Proxy support 없음 모든 traffic이 머신의 기본 IP로 나갑니다. datacenter IP는 빠르게 flag됩니다.
신뢰성 이슈 Cursor 2.3.18+에서 click, scroll, element 탐색 regression이 보고되었습니다.

agent가 로그인하거나 Cloudflare 뒤의 데이터를 읽거나 production site에서 multi-step workflow를 돌린다면 내장 webview는 약한 기반입니다.


CDP가 제공하는 것

CDP(Chrome DevTools Protocol)는 Chromium browser를 코드로 제어하는 표준 인터페이스입니다. Playwright는 connectOverCDP, Puppeteer는 puppeteer.connect를 사용하고, raw CDP client는 debugging port로 WebSocket을 엽니다.

Cursor를 외부 browser에 CDP로 연결하면 다음을 얻습니다.

  • 실제 브라우저: 완전한 rendering engine, extension, 표준 API
  • Persistent session: cookies와 login state가 agent 실행 사이에 유지됨
  • 페이지 전체 제어: Playwright와 Puppeteer가 쓰는 동일한 protocol
  • Anti-detection: browser가 fingerprint와 proxy identity를 일관되게 관리

연결은 표준 WebSocket URL입니다. CDP를 말하는 tool은 CDP endpoint를 노출하는 어떤 browser에도 붙을 수 있습니다. Clawbrowser는 각 profile에 endpoint를 제공합니다.


Cursor를 Clawbrowser에 연결하기: 단계별

준비물

  • macOS(Apple Silicon), Linux(x64 또는 arm64), 또는 Windows
  • Cursor 설치
  • app.clawbrowser.ai의 Clawbrowser API key

1단계: Clawbrowser 설치

clawctl bootstrapper를 다운로드하고 압축을 풉니다.

# macOS (Apple Silicon)
archive="clawctl-macos-arm64.tar.gz"
curl -fL --retry 3 -o "$archive" \
  "https://github.com/clawbrowser/clawctl/releases/latest/download/${archive}"
tar -xzf "$archive"

Linux에서는 clawctl-linux-amd64.tar.gz 또는 clawctl-linux-arm64.tar.gz를 사용합니다. Docker나 sudo는 필요 없습니다.

API key를 설정합니다.

./clawctl config set api-key

2단계: 브라우저 profile 시작

이름 있는 profile로 Clawbrowser를 시작합니다. 각 profile은 고유 fingerprint, cookie storage, 선택적 proxy를 가집니다.

# Start a profile and open the verification page
clawctl start --profile cursor-dev --url clawbrowser://verify/ --json

# Get the CDP endpoint for this profile
clawctl endpoint --profile cursor-dev --json

endpoint 명령은 http://127.0.0.1:9222 같은 URL을 반환합니다. Cursor agent가 연결할 CDP endpoint입니다.

3단계: Cursor에서 MCP로 연결

가장 쉬운 통합은 Clawbrowser 내장 MCP server를 쓰는 것입니다. navigation, screenshots, clicks, tab management, profile startup을 Cursor가 호출할 수 있는 MCP tools로 제공합니다. CDP 연결은 server가 내부에서 관리합니다.

로컬 MCP 설정을 쓰려면 installer를 실행합니다.

clawctl install --agent all --json

Cursor는 이 설정에서 MCP server를 읽습니다.

대안: Microsoft Playwright MCP

공식 Microsoft Playwright MCP server를 선호한다면 Cursor Settings > MCP > Add Server에서 Clawbrowser CDP endpoint를 지정합니다.

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [

두 방식 모두 Cursor에 높은 수준의 browser 제어를 제공합니다. Clawbrowser MCP server는 profile과 fingerprint 관리 기능을 더합니다.

4단계: 연결 확인

Cursor agent에게 테스트 페이지를 열게 합니다.

Navigate to https://browserleaks.com/canvas and take a screenshot. Tell me what canvas fingerprint hash you see.

연결이 되면 sandboxed webview의 generic hash가 아니라 Clawbrowser profile의 실제 canvas fingerprint가 보입니다.


코드에서 직접 CDP 연결

Cursor agent가 MCP tools 대신 script를 작성하고 실행한다면 Playwright 또는 Puppeteer로 직접 연결합니다.

Playwright (Python)

from playwright.async_api import async_playwright

async def browse_with_clawbrowser():
    async with async_playwright() as p:
        # Connect to Clawbrowser's CDP endpoint

Playwright (Node.js)

const { chromium } = require('playwright');

const browser = await chromium.connectOverCDP('http://127.0.0.1:9222');
const page = browser.contexts()[0].pages()[0];

Puppeteer

const puppeteer = require('puppeteer');

const browser = await puppeteer.connect({
  browserURL: 'http://127.0.0.1:9222'
});

세 framework 모두 같은 CDP endpoint에 연결합니다. Clawbrowser는 identity layer를 아래에서 처리합니다. Canvas, WebGL, AudioContext, fonts, screen resolution, timezone, navigator properties, proxy routing이 profile 안에서 일관됩니다.


Cursor agent에 anti-detection이 중요한 이유

Cursor agent가 표준 browser로 웹을 탐색하면 anti-bot 시스템은 여러 surface에서 browser identity를 확인합니다.

Signal 확인 항목 Standard Chrome Clawbrowser
Canvas hash GPU rendering fingerprint Static, matches known automation profiles Unique per profile, consistent with reported GPU
WebGL renderer Graphics card identifier Exposes real hardware Matches the profile's simulated hardware
Navigator properties Browser version, platform, language Generic Chromium values Consistent with profile's OS and locale
Timezone System timezone vs IP geo Mismatches with proxy location Auto-aligned with proxy geography
CDP detection Runtime.enable traces Detectable via leaked CDP artifacts Engine-level patches suppress CDP signals

CDP로 제어되는 일반 Chromium instance는 anti-bot script가 빠르게 읽을 수 있는 흔적을 남깁니다. Clawbrowser는 JavaScript override가 아니라 engine level에서 이를 patch합니다.

즉 Cursor를 chrome --remote-debugging-port=9222에 붙이는 것과 Clawbrowser에 붙이는 것은 browser identity 품질이 다릅니다.


여러 profile 관리

각 Clawbrowser profile은 완전히 격리됩니다. 여러 계정이나 프로젝트를 위해 여러 profile을 동시에 실행할 수 있습니다.

# Create three profiles with different locations
clawctl create --profile account-a --location sweden --json
clawctl create --profile account-b --location germany --json
clawctl create --profile account-c --location japan --json

각 profile은 고유 fingerprint, 자체 proxy IP, isolated storage를 가집니다. 플랫폼은 서로 다른 국가의 서로 다른 머신에서 온 독립 사용자로 봅니다.

Cursor agent는 다른 CDP endpoint에 연결해 profile을 바꾸거나 한 script에서 여러 profile을 병렬로 제어할 수 있습니다.


Cursor built-in browser vs CDP vs Clawbrowser

Cursor built-in Chrome via CDP Clawbrowser via CDP
Browser engine Sandboxed webview Real Chromium Real Chromium (patched)
Session persistence Workspace-scoped Manual profile dirs Named profiles with auto-persistence
Fingerprint management None None 20+ surfaces managed per profile
Proxy support None Manual flag Profile-bound, geo-aligned
Anti-bot survival Blocked instantly Blocked within minutes Passes Cloudflare, DataDome, PerimeterX
Multi-account Not possible Separate --user-data-dir Built-in profile isolation
Setup complexity Zero (built in) Moderate Three commands

내장 browser는 localhost 앱 점검용으로 쓰세요. 실제 웹에 닿는 workflow는 Clawbrowser via CDP가 맞습니다.


FAQ

Cursor agent mode에서 동작하나요?

예. Cursor agent mode는 CDP로 외부 browser에 연결하는 MCP server를 포함해 어떤 MCP server든 사용할 수 있습니다. action은 sandboxed webview가 아니라 Clawbrowser에서 실행됩니다.

Playwright나 Puppeteer를 설치해야 하나요?

agent가 automation script를 작성하고 실행할 때만 필요합니다. MCP workflow에서는 server가 내부에서 CDP 연결을 관리합니다.

Cursor project 사이에서 login session을 재사용할 수 있나요?

예. Clawbrowser profile은 cookies, localStorage, IndexedDB를 유지합니다. 한 번 로그인한 profile을 다른 workspace에서 다시 사용할 수 있습니다.

Cursor browser tool과 외부 browser가 헷갈리면 어떻게 하나요?

Settings > Features > Browser에서 내장 browser를 끌 수 있습니다. 둘을 동시에 둬도 독립된 browser라 함께 동작합니다.

Clawbrowser는 무료인가요?

예. Clawbrowser는 무료, open source, MIT-licensed입니다. seat fee, usage limit, browser runtime subscription이 없습니다. 설치 검증에는 app.clawbrowser.ai의 API key가 필요합니다.


시작하기

Cursor agent를 실제 browser에 연결하는 세 명령입니다.

# Install Clawbrowser
clawctl install --json

# Set your API key
clawctl config set api-key

반환된 endpoint를 MCP server 또는 Playwright script에 지정하세요. Cursor agent는 managed fingerprints, persistent sessions, proxy routing을 가진 browser로 웹을 탐색합니다.

CDP 배경은 CDP Browser for AI Agents 개발자 가이드를 보세요. fingerprinting은 브라우저 지문: 20가지 자동화 신호에서 설명합니다.

계속 읽기

모든 글 보기 →