NeoDrew/chromeflow

chromeflow은(는) 무엇을 하나요?

AI 코딩 에이전트(Claude Code 또는 Codex CLI)가 실제 Chrome을 제어하여 클릭, 양식 작성, API 키 획득 및 .env 파일에 쓰기를 수행할 수 있도록 합니다. 실제 세션, 실제 쿠키, 새 브라우저 샌드박스 없이 작동합니다.

설명

이 스킬은 AI 코딩 에이전트가 사용자의 실제 Chrome 브라우저를 직접 제어할 수 있게 해주는 도구입니다. 개발자가 웹 애플리케이션과 상호작용하며 API 키를 가져오고, 양식을 작성하고, 버튼을 클릭하는 등의 작업을 자동화합니다. 기존 브라우저 세션과 쿠키를 그대로 사용하므로 로그인 상태 유지가 필요하거나 복잡한 워크플로우를 처리해야 하는 상황에 특히 유용합니다.

주요 기능

• 실제 브라우저 제어: AI 에이전트가 사용자의 Chrome 브라우저를 원격으로 제어합니다.
• 자동화 작업: 클릭, 양식 작성, 데이터 추출 등 웹 상호작용을 자동화합니다.
• 세션 유지: 기존 브라우저 세션과 쿠키를 활용하여 인증 상태를 유지합니다.
• 환경 변수 관리: 획득한 API 키 등을 자동으로 .env 파일에 기록합니다.

지원 플랫폼

• Claude Code
• Codex CLI

작동 방식

이 스킬은 Chrome의 DevTools Protocol(CDP) 또는 Puppeteer와 같은 도구를 내부적으로 활용하여 브라우저를 제어합니다. AI 에이전트는 명령어를 통해 현재 브라우저 탭의 내용을 읽고, 특정 요소를 선택하여 클릭하거나 텍스트를 입력할 수 있습니다. 또한 네트워크 요청을 가로채서 API 응답에서 필요한 키나 데이터를 추출한 후, 이를 로컬 파일 시스템의 .env 파일에 자동으로 저장합니다.

사용 예시

# AI 에이전트에게 다음과 같이 요청할 수 있습니다:
"내 브라우저에서 https://example.com/api-keys 페이지로 이동해."
"로그인 버튼을 클릭하고 이메일과 비밀번호를 입력해줘."
"네트워크 요청에서 받은 API 키를 .env 파일에 저장해줘."

전제 조건

• Chrome 브라우저가 설치되어 있어야 합니다.
• AI 에이전트(Claude Code 또는 Codex CLI)가 실행 중이어야 합니다.
• 필요한 권한(파일 읽기/쓰기, 네트워크 접근)이 허용되어야 합니다.

설치 방법

(설치 방법은 저장소의 README 또는 별도 문서를 참조하세요.)

참고 사항

• 이 스킬은 사용자의 실제 브라우저 데이터를 사용하므로, 민감한 정보가 포함된 세션을 다룰 때 주의가 필요합니다.
• 보안을 위해 예상치 못한 동작이 발생할 경우 즉시 사용을 중단하시기 바랍니다.