Chrome 통합은 베타 버전이며 현재 Google Chrome에서만 작동합니다. Brave, Arc 또는 기타 Chromium 기반 브라우저에서는 아직 지원되지 않습니다. WSL(Windows Subsystem for Linux)도 지원되지 않습니다.
기능
Chrome이 연결되면 단일 워크플로우에서 브라우저 작업과 코딩 작업을 연결할 수 있습니다.- 라이브 디버깅: 콘솔 오류 및 DOM 상태를 직접 읽은 후 이를 유발한 코드를 수정합니다.
- 디자인 검증: Figma 목업에서 UI를 빌드한 후 브라우저에서 열어 일치하는지 확인합니다.
- 웹 앱 테스트: 양식 유효성 검사를 테스트하고, 시각적 회귀를 확인하거나, 사용자 흐름을 검증합니다.
- 인증된 웹 앱: API 커넥터 없이 Google Docs, Gmail, Notion 또는 로그인한 모든 앱과 상호작용합니다.
- 데이터 추출: 웹 페이지에서 구조화된 정보를 가져와 로컬에 저장합니다.
- 작업 자동화: 데이터 입력, 양식 작성 또는 다중 사이트 워크플로우와 같은 반복적인 브라우저 작업을 자동화합니다.
- 세션 기록: 브라우저 상호작용을 GIF로 기록하여 발생한 상황을 문서화하거나 공유합니다.
필수 요구사항
Chrome에서 Claude Code를 사용하기 전에 다음이 필요합니다.- Google Chrome 브라우저
- Claude in Chrome 확장 프로그램 버전 1.0.36 이상
- Claude Code 버전 2.0.73 이상
- 직접 Anthropic 플랜 (Pro, Max, Team 또는 Enterprise)
Chrome 통합은 Amazon Bedrock, Google Cloud Vertex AI 또는 Microsoft Foundry와 같은 타사 제공자를 통해 사용할 수 없습니다. 타사 제공자를 통해서만 Claude에 액세스하는 경우 이 기능을 사용하려면 별도의 claude.ai 계정이 필요합니다.
CLI에서 시작하기
Chrome으로 Claude Code 시작
--chrome 플래그로 Claude Code를 시작합니다./chrome을 실행하여 Chrome을 활성화할 수도 있습니다./chrome을 실행하여 연결 상태를 확인하고, 권한을 관리하거나, 확장 프로그램을 다시 연결합니다.
VS Code의 경우 VS Code에서 브라우저 자동화를 참조하세요.
기본적으로 Chrome 활성화
각 세션마다--chrome을 전달하지 않으려면 /chrome을 실행하고 “기본적으로 활성화”를 선택합니다.
VS Code 확장 프로그램에서는 Chrome 확장 프로그램이 설치되어 있으면 Chrome을 사용할 수 있습니다. 추가 플래그가 필요하지 않습니다.
CLI에서 기본적으로 Chrome을 활성화하면 브라우저 도구가 항상 로드되므로 컨텍스트 사용량이 증가합니다. 컨텍스트 소비가 증가하는 것을 발견하면 이 설정을 비활성화하고 필요할 때만
--chrome을 사용합니다.사이트 권한 관리
사이트 수준 권한은 Chrome 확장 프로그램에서 상속됩니다. Chrome 확장 프로그램 설정에서 권한을 관리하여 Claude가 탐색하고, 클릭하고, 입력할 수 있는 사이트를 제어합니다.예제 워크플로우
이 예제들은 브라우저 작업과 코딩 작업을 결합하는 일반적인 방법을 보여줍니다./mcp를 실행하고 claude-in-chrome을 선택하여 사용 가능한 브라우저 도구의 전체 목록을 확인합니다.
로컬 웹 애플리케이션 테스트
웹 앱을 개발할 때 Claude에게 변경 사항이 올바르게 작동하는지 확인하도록 요청합니다.콘솔 로그로 디버깅
Claude는 콘솔 출력을 읽어 문제 진단을 도울 수 있습니다. 로그가 상세할 수 있으므로 모든 콘솔 출력을 요청하는 대신 Claude에게 찾을 패턴을 알려줍니다.양식 작성 자동화
반복적인 데이터 입력 작업을 가속화합니다.Google Docs에서 콘텐츠 작성
API 설정 없이 Claude를 사용하여 문서에 직접 작성합니다.웹 페이지에서 데이터 추출
웹사이트에서 구조화된 정보를 가져옵니다.다중 사이트 워크플로우 실행
여러 웹사이트에서 작업을 조정합니다.데모 GIF 기록
브라우저 상호작용의 공유 가능한 기록을 만듭니다.문제 해결
확장 프로그램이 감지되지 않음
Claude Code에 “Chrome 확장 프로그램이 감지되지 않음”이 표시되는 경우:- Chrome 확장 프로그램이 설치되어 있고
chrome://extensions에서 활성화되어 있는지 확인합니다. claude --version을 실행하여 Claude Code가 최신 버전인지 확인합니다.- Chrome이 실행 중인지 확인합니다.
/chrome을 실행하고 “확장 프로그램 다시 연결”을 선택하여 연결을 다시 설정합니다.- 문제가 지속되면 Claude Code와 Chrome을 모두 다시 시작합니다.
- macOS:
~/Library/Application Support/Google/Chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json - Linux:
~/.config/google-chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json - Windows: Windows 레지스트리에서
HKCU\Software\Google\Chrome\NativeMessagingHosts\를 확인합니다.
브라우저가 응답하지 않음
Claude의 브라우저 명령이 작동하지 않는 경우:- 모달 대화 상자(경고, 확인, 프롬프트)가 페이지를 차단하고 있는지 확인합니다. JavaScript 대화 상자는 브라우저 이벤트를 차단하고 Claude가 명령을 수신하지 못하게 합니다. 대화 상자를 수동으로 닫은 후 Claude에게 계속하도록 알립니다.
- Claude에게 새 탭을 만들고 다시 시도하도록 요청합니다.
chrome://extensions에서 Chrome 확장 프로그램을 비활성화했다가 다시 활성화하여 다시 시작합니다.
긴 세션 중 연결 끊김
Chrome 확장 프로그램의 서비스 워커는 확장 세션 중에 유휴 상태가 될 수 있으며, 이는 연결을 끊습니다. 비활성 기간 후 브라우저 도구가 작동하지 않으면/chrome을 실행하고 “확장 프로그램 다시 연결”을 선택합니다.
Windows 관련 문제
Windows에서 다음을 만날 수 있습니다.- 명명된 파이프 충돌 (EADDRINUSE): 다른 프로세스가 동일한 명명된 파이프를 사용 중인 경우 Claude Code를 다시 시작합니다. Chrome을 사용 중일 수 있는 다른 Claude Code 세션을 모두 닫습니다.
- 네이티브 메시징 호스트 오류: 시작 시 네이티브 메시징 호스트가 충돌하면 Claude Code를 다시 설치하여 호스트 구성을 다시 생성해 봅니다.
일반적인 오류 메시지
가장 자주 발생하는 오류와 해결 방법은 다음과 같습니다.| 오류 | 원인 | 해결 방법 |
|---|---|---|
| ”브라우저 확장 프로그램이 연결되지 않음” | 네이티브 메시징 호스트가 확장 프로그램에 도달할 수 없음 | Chrome과 Claude Code를 다시 시작한 후 /chrome을 실행하여 다시 연결합니다. |
| ”확장 프로그램이 감지되지 않음” | Chrome 확장 프로그램이 설치되지 않았거나 비활성화됨 | chrome://extensions에서 확장 프로그램을 설치하거나 활성화합니다. |
| ”사용 가능한 탭 없음” | Claude가 탭이 준비되기 전에 작동하려고 시도함 | Claude에게 새 탭을 만들고 다시 시도하도록 요청합니다. |
| ”수신 끝이 존재하지 않음” | 확장 프로그램 서비스 워커가 유휴 상태가 됨 | /chrome을 실행하고 “확장 프로그램 다시 연결”을 선택합니다. |
참고 항목
- VS Code에서 Claude Code 사용: VS Code 확장 프로그램의 브라우저 자동화
- CLI 참조:
--chrome을 포함한 명령줄 플래그 - 일반적인 워크플로우: Claude Code를 사용하는 더 많은 방법
- 데이터 및 개인정보: Claude Code가 데이터를 처리하는 방법
- Chrome에서 Claude 시작하기: 바로 가기, 일정 예약 및 권한을 포함한 Chrome 확장 프로그램의 전체 문서