Claude 크롬 확장 프로그램 내부 구조 심층 분석 (v1.0.56)

핵심 요약

Anthropic의 Claude 크롬 확장 프로그램은 브라우저 내에서 직접 실행되는 강력한 AI 에이전트 시스템이다. 이 시스템은 React와 Anthropic JS SDK를 사용하여 구축되었으며, Chrome DevTools Protocol(CDP)을 통해 사용자의 브라우저를 직접 제어한다. 표준 모드와 퀵 모드라는 두 가지 운영 방식을 통해 효율성과 성능을 최적화하며, 엄격한 권한 관리 모델과 도메인 안전성 검사를 통해 보안을 유지한다. 결과적으로 이 확장 프로그램은 단순한 챗봇을 넘어 웹 페이지를 이해하고 상호작용하는 자율 에이전트의 실질적인 구현 사례를 보여준다.

배경

Chrome Extension 개발 지식, LLM Tool Calling 개념, Chrome DevTools Protocol(CDP)에 대한 이해

대상 독자

AI 에이전트 개발자, 브라우저 확장 프로그램 엔지니어, LLM 보안 연구자

의미 / 영향

이 분석은 상용 수준의 브라우저 에이전트가 직면하는 기술적 도전인 비용, 지연 시간, 보안을 어떻게 해결하고 있는지에 대한 청사진을 제공한다. 특히 CDP와 접근성 트리의 결합은 향후 웹 자동화 에이전트의 표준 아키텍처가 될 가능성이 높다.

섹션별 상세

아키텍처 및 인증 메커니즘은 Manifest V3 기반의 React 앱으로 구성되며 브라우저에서 직접 Anthropic SDK를 실행한다. OAuth PKCE 또는 수동 API 키를 통해 인증하며 사이드 패널 형태로 동작하여 현재 탭의 컨텍스트를 실시간으로 파악한다.

에이전트 루프 운영 모드는 표준 모드와 퀵 모드로 나뉜다. 표준 모드는 서버 설정을 기반으로 시스템 프롬프트를 구성하고 도구 사용 루프를 실행하는 반면, 퀵 모드는 지연 시간을 줄이기 위해 도구 정의 대신 단일 문자로 구성된 압축 명령어를 사용한다.

컴퓨터 제어 도구는 Chrome DevTools Protocol(CDP v1.3)을 사용하여 마우스 클릭, 키보드 입력, 스크린샷 캡처 등을 수행한다. 특히 스크린샷은 토큰 비용 최적화를 위해 특정 알고리즘으로 리사이징되며 좌표 매핑을 위한 스케일링 컨텍스트를 유지한다.

페이지 이해 및 상호작용을 위해 read_page 도구는 DOM을 재귀적으로 탐색하여 접근성 트리를 생성하고 ARIA 역할을 매핑한다. find 도구는 내부적으로 별도의 LLM 호출을 사용하여 자연어 쿼리에 맞는 요소를 접근성 트리에서 의미론적으로 검색한다.

보안 및 권한 모델은 PermissionManager를 통해 모든 도구 실행을 제어하며 도메인별로 권한을 관리한다. 특히 도메인 전환 시나리오에서의 공격을 방지하기 위해 실행 직전 URL 일치 여부를 검증하고 위험 도메인은 Anthropic 서버 API를 통해 실시간으로 분류 및 차단한다.

MCP(Model Context Protocol) 통합을 통해 Claude Desktop 또는 Claude Code와 네이티브 메시징으로 연결되어 외부에서도 브라우저 도구를 호출할 수 있게 한다. 또한 원격 MCP 서버와의 연결을 지원하여 확장 프로그램의 기능을 동적으로 확장할 수 있는 구조를 갖추고 있다.

워크플로 녹화 및 자동화 기능은 사용자의 브라우저 동작을 rrweb을 통해 녹화하고 Claude Haiku 모델을 사용하여 각 단계를 설명하는 재사용 가능한 숏컷으로 변환한다. 생성된 워크플로는 스케줄링 기능을 통해 주기적으로 실행될 수 있다.

실무 Takeaway

브라우저 에이전트 구현 시 DOM 직접 조작보다 접근성 트리를 활용하는 것이 LLM의 페이지 이해도를 높이는 데 효과적이다.
지연 시간에 민감한 에이전트 작업의 경우 표준 도구 호출 대신 압축된 전용 명령어 세트를 사용하는 퀵 모드 방식이 효율적인 대안이 된다.
에이전트 보안을 위해 도구 실행 직전의 상태 검증과 도메인 기반의 세밀한 권한 제어 시스템 구축이 필수적이다.