MCP 서버 내장 Chromium 브라우저 기반 LLM-Browser 직접 제어 구조 구현

I got tired of copy-pasting between Claude and Chrome.

Valentin Monteiro2026년 4월 10일2분intermediate

AI 요약

Context

LLM과 브라우저 간의 단절로 인해 DOM, Console, Network 데이터의 수동 복사-붙여넣기 과정 발생. 모델이 실제 페이지 상태가 아닌 추론에 의존하여 잘못된 경로를 제시하는 Blind AI 문제로 인한 개발 효율 저하.

Electron 기반 Chromium 브라우저 내부에 Native MCP Server를 통합한 구조 설계
DOM, Accessibility Tree, Network Requests, Console Logs를 MCP Resource로 노출하여 LLM의 실시간 페이지 상태 인지 구현
Navigate, Click, Type, Execute JavaScript 등 18종의 Automation Tool을 제공하여 LLM의 브라우저 직접 제어 권한 부여
WebSocket 기반 Discovery File을 통한 Claude Code와의 자동 연결 및 설정 프로세스 제거
stdio Bridge 설계를 통한 Codex, Gemini 등 타 CLI 도구와의 프로토콜 호환성 확보
Browser Extension의 권한 제한을 극복하기 위해 Main Process에서 MCP 서버를 실행하는 아키텍처 채택

실천 포인트

1. LLM 기반 자동화 도구 설계 시 단순 API 연동을 넘어 대상 시스템의 State(DOM, Log)를 실시간으로 읽을 수 있는 Read-only Resource 정의 검토

2. 외부 도구 간 연결성 강화를 위해 WebSocket 기반의 Auto-discovery 메커니즘 도입 고려

3. Browser Extension의 샌드박스 제약을 회피해야 하는 경우 Electron 등 Native Wrapper 기반의 통합 환경 구축 검토

태그