컴퓨터 사용 에이전트(CUA) 구축하기
컴퓨터 사용 에이전트는 사람이 하는 것처럼 브라우저를 열고 페이지를 살펴본 다음 보고 있는 내용에서 최적의 다음 동작을 선택하여 웹사이트와 상호작용할 수 있습니다. 이 강의에서는 Airbnb를 검색하고, 구조화된 목록 데이터를 추출하며, 스톡홀름에서 가장 저렴한 숙박을 찾는 브라우저 자동화 에이전트를 구축할 것입니다.
이 강의는 AI 기반 탐색을 위한 Browser-Use, 브라우저 제어를 위한 Playwright와 Chrome DevTools Protocol(CDP), 비전 기반 추론을 위한 Azure OpenAI, 그리고 구조화된 추출을 위한 Pydantic을 결합합니다.
소개
이 강의에서는 다음 내용을 다룹니다:
- 컴퓨터 사용 에이전트가 API 전용 자동화보다 더 적합한 경우 이해하기
- 신뢰할 수 있는 브라우저 라이프사이클 관리를 위해 Browser-Use와 Playwright 및 CDP 결합하기
- 동적 웹 페이지에서 Azure OpenAI 비전과 Pydantic 구조화 출력으로 목록 데이터 추출하기
- 에이전트 우선, 액터 우선 또는 하이브리드 브라우저 자동화 워크플로우 중 언제 어떤 방식을 사용할지 결정하기
학습 목표
이 강의를 완료하면 다음을 할 수 있습니다:
- Azure OpenAI와 Playwright로 Browser-Use 구성하기
- 실제 웹사이트를 탐색하고 동적 UI 요소를 처리하는 브라우저 자동화 워크플로우 구축하기
- 페이지에서 가시적인 콘텐츠를 타입화된 결과로 추출하여 후속 비즈니스 로직에 활용하기
- 브라우저 작업의 예측 가능성에 따라 에이전트 패턴과 액터 패턴 중 선택하기
코드 샘플
이 강의는 하나의 노트북 튜토리얼을 포함합니다:
- 15-browser-user.ipynb: CDP를 통해 Chrome 세션을 실행하고 Airbnb에서 스톡홀름 목록을 검색하며, Browser-Use 비전을 사용해 가격을 추출하고 가장 저렴한 옵션을 구조화된 데이터로 반환합니다.
선수 지식
- Python 3.12 이상
- Azure OpenAI 배포가 환경에 구성되어 있어야 함
- 로컬에 Chrome 또는 Chromium 설치
- Playwright 의존성 설치
- 비동기 Python에 대한 기본 지식
설정
노트북에서 사용하는 패키지를 설치하세요:
pip install browser_use playwright python-dotenv
playwright install chromium
노트북에서 사용하는 Azure OpenAI 환경 변수를 설정하세요:
AZURE_OPENAI_ENDPOINT=...
AZURE_OPENAI_API_KEY=...
AZURE_OPENAI_CHAT_DEPLOYMENT_NAME=...
# 선택 사항: 생략 시 최신 API 버전이 기본값입니다
AZURE_OPENAI_API_VERSION=...
아키텍처 개요
이 노트북은 하이브리드 브라우저 자동화 워크플로우를 보여줍니다:
- CDP가 활성화된 Chrome이 시작되어 Playwright와 Browser-Use가 동일한 브라우저 세션을 공유할 수 있습니다.
- Browser-Use 에이전트가 Airbnb 열기, 팝업 닫기, 스톡홀름 검색과 같은 개방형 탐색 작업을 처리합니다.
- 활성 페이지는 구조화된 Pydantic 스키마로 검사되어 목록 제목, 1박 가격, 평점, URL을 추출합니다.
- 파이썬 로직이 추출된 목록을 비교하여 가장 저렴한 결과를 강조합니다.
이 접근법은 Browser-Use가 잘하는 유연한 비전 기반 추론을 유지하면서도 필요할 때 결정론적 브라우저 제어를 제공합니다.
주요 요점 및 모범 사례
에이전트 vs 액터 사용 시기
| 시나리오 |
에이전트 사용 |
액터 사용 |
| 동적 레이아웃 |
예, AI가 페이지 변화에 적응 가능 |
아니요, 깨지기 쉬운 셀렉터 문제 발생 가능 |
| 구조가 알려진 경우 |
아니요, 에이전트는 직접 제어보다 느림 |
예, 빠르고 정확함 |
| 요소 찾기 |
예, 자연어가 효과적임 |
아니요, 정확한 셀렉터 필요 |
| 타이밍 제어 |
아니요, 예측 불가 |
예, 대기 및 재시도 완전 제어 가능 |
| 복잡한 워크플로우 |
예, 예상치 못한 UI 상태 처리 가능 |
아니요, 명시적 분기 필요 |
Browser-Use 모범 사례
- 탐색과 동적 네비게이션에는 에이전트로 시작하세요.
- 동작이 예측 가능해지면 직접 페이지 제어로 전환하세요.
- 추출된 데이터가 검증되고 타입 안전하도록 구조화된 출력 모델을 사용하세요.
- 눈에 보이는 UI 변화를 유발하는 동작 후에는 전략적으로 지연을 추가하세요.
- 실패 시 디버깅이 용이하도록 반복 중 스크린샷을 캡처하세요.
- 웹사이트가 변할 수 있음을 예상하고 팝업과 레이아웃 이동에 대한 대체 전략을 설계하세요.
- 에이전트와 액터 패턴을 혼합하여 유연성과 정밀도를 모두 얻으세요.
브라우저 에이전트 안전 가이드라인
브라우저 에이전트는 실시간 웹사이트에서 작동하므로, 알려진 API만 호출하는 스크립트보다 더 엄격한 경계가 필요합니다. 노트북 데모에서 실제 워크플로우로 이동하기 전에 에이전트가 볼 수 있고 클릭하거나 제출할 수 있는 내용을 제한하는 통제를 정의하세요.
- 탐색 환경 범위 지정. 전용 브라우저 프로필이나 샌드박스에서 에이전트를 실행하고 작업에 필요한 도메인으로 제한하세요.
- 관찰과 행위를 분리. 에이전트가 먼저 탐색, 읽기, 데이터 추출을 하도록 하며, 양식 제출, 메시지 전송, 여행 예약, 구매, 기록 삭제 또는 계정 설정 변경 전에 명시적 승인을 요구하세요.
- 비밀번호나 민감한 정보는 프롬프트와 로그에 포함하지 마세요. 세션 쿠키, 원시 개인 데이터도 마찬가지입니다. 인증은 사용자가 직접 하고 민감 정보는 로그에서 가려야 합니다.
- 페이지 콘텐츠를 신뢰하지 않는 입력으로 간주하세요. 웹사이트는 에이전트가 아닌 사용자를 위한 지시를 포함할 수 있습니다. 에이전트는 목표 변경, 데이터 공개, 보호 장치 비활성화 또는 무관한 사이트 방문 요청 텍스트를 무시해야 합니다.
- 위험 단계는 결정론적 검증을 사용하세요. 현재 URL, 페이지 제목, 선택 항목, 가격, 수신자, 동작 요약을 코드로 검증하고 최종 승인을 요청하세요.
- 예산과 중지 조건을 설정하세요. 에이전트가 사용할 수 있는 동작 수, 재시도, 탭, 시간 제한을 설정하고 상태가 모호하면 중단하세요.
- 모든 것을 기록하지 말고 유용한 증거만 보관하세요. 동작 요약, 타임스탬프, URL, 선택된 요소 설명, 스크린샷 참조를 보관하여 실패를 검토할 수 있게 하며, 불필요한 민감 페이지 내용 저장은 피하세요.
Airbnb 샘플에서는 기본적으로 목록 검색과 가격 추출만 수행하는 것이 안전합니다. 로그인, 호스트 연락, 예약 완료는 사용자의 별도 승인이 필요합니다.
실제 적용 사례
- 여행 예약 및 가격 모니터링
- 전자상거래 가격 비교 및 재고 확인
- 동적 웹사이트에서 구조화된 데이터 추출
- 비전 인지 UI 테스트 및 검증
- 웹사이트 모니터링 및 알림
- 다단계 흐름에서의 지능형 양식 작성
실제 예시: Microsoft 프로젝트 오팔
이 강의에서 구축할 에이전트는 브라우저를 사람처럼 제어하는 컴퓨터 사용 에이전트(CUA)의 소규모 로컬 버전입니다. Microsoft는 이 개념을 Microsoft 365 Copilot 내 기능인 프로젝트 오팔(Frontier)로 기업에 적용하고 있습니다.
프로젝트 오팔에서는 작업을 설명하면 에이전트가 보안 Windows 365 Cloud PC에서 컴퓨터 사용하여 조직의 브라우저 기반 애플리케이션, 사이트, 데이터를 비동기적으로 백그라운드에서 처리하며 언제든 작업을 안내하거나 제어할 수 있습니다. 예시 작업은 다음과 같습니다:
- 보안 그룹 멤버십 요청 관리
- 컴플라이언스 검토를 위한 감사 증거 수집 및 검증
- IT 인시던트 분류(티켓 상태 업데이트, 담당자 지정, 중복 종료)
- Excel 데이터를 재무 마감 보고서로 편집
오팔은 프로덕션급, 신뢰할 수 있는 컴퓨터 사용 에이전트가 어떤 모습인지 유용한 참고 사례이며, 이전 강의 개념을 강화합니다:
| 본 과정 개념 |
프로젝트 오팔 적용 |
| 사람 참여 루프 (강의 06) |
오팔은 로그인 정보, 민감 데이터, 모호한 지시가 있을 때 일시 중지하며, 명시적 확인 없이는 비밀번호 입력이나 양식 제출을 하지 않습니다. 작업 중간에 제어 취득과 제어 반환이 가능합니다. |
| 신뢰할 수 있고 안전한 에이전트 (강의 06 & 18) |
격리된 Windows 365 Cloud PC에서 실행되고 기본적으로 브라우저 전용(기타 컴퓨터 접근 차단, Intune으로 강제)이며, 당신의 신원으로 권한이 있는 자원만 접근하고 모든 동작을 기록하여 감사 가능하게 합니다. |
| 계획 및 메타인지 (강의 07 & 09) |
작업 계획을 먼저 생성한 다음 각 단계의 추론을 감독하고 의심스러운 행동을 감지하면 일시 중지합니다. |
| 재사용 가능한 기능/도구 (강의 04) |
스킬은 반복 작업에 대한 지시를 작성하고(마크다운 파일에서 가져오거나 오팔에서 작성) 대화 중 재사용할 수 있습니다. |
이용 가능성: 프로젝트 오팔은 현재 Microsoft 365 Copilot 구독 사용자 대상으로 Frontier 조기 액세스 프로그램에서 사용 가능하며, 관리자의 설정 완료가 필요합니다. 실험적 Frontier 기능이라 기능이 변경될 수 있습니다.
지식 점검
다음 강의로 넘어가기 전 이해도를 테스트하세요.
1. 언제 브라우저 기반 컴퓨터 사용 에이전트가 API 전용 워크플로우보다 더 적합한가요?
답변
작업이 웹 UI에서 보이는 내용에 의존하거나, 사이트가 필요한 API를 제공하지 않거나, 페이지가 자주 변경되어 고정 API 또는 셀렉터 로직이 취약할 때는 브라우저 에이전트를 사용하세요. 같은 작업에 안정적인 API가 있다면 보통 API가 더 빠르고, 테스트하기 쉽고, 보안에도 유리하기 때문에 API를 우선합니다.
2. 하이브리드 워크플로우에서 에이전트는 어떤 부분을 처리하고, 직접 Playwright 코드는 어떤 부분을 처리해야 할까요?
답변
에이전트는 개방형 탐색과 동적 UI 상태 처리, 예를 들어 올바른 페이지 찾기나 예상치 못한 팝업 닫기를 담당하게 하세요. 페이지 구조가 알려지고 동작에 정밀함, 재시도, 대기, 결정론적 검증이 필요할 때는 직접 Playwright 제어로 전환하세요.
3. Airbnb 샘플은 사용자가 예약할 만한 숙소를 찾습니다. 로그인, 호스트 연락, 예약 완료 전에 무엇이 이루어져야 하나요?
답변
워크플로우는 일시 정지하고 명시적 사용자 승인을 요청해야 합니다. 문의 전 선택된 숙소 요약, 현재 URL, 가격, 날짜, 예정된 동작을 명확히 보여줘야 합니다. 검색과 가격 추출은 자율적으로 수행해도 되나, 계정 접근, 메시지 전송, 구매, 예약 등은 사용자가 승인해야 합니다.
4. 웹 페이지가 에이전트에게 원래 지시를 무시하고 다른 사이트를 방문하며 저장된 자격 증명을 공개하라고 합니다. 에이전트는 이 텍스트를 어떻게 처리해야 할까요?
답변
개발자나 사용자 지시로 간주하지 말고 신뢰할 수 없는 페이지 콘텐츠로 처리하세요. 에이전트는 허용된 도메인과 작업 범위를 벗어나지 않고, 비밀 공개를 거부하며, 목표 변경, 보호 장치 비활성화, 무관한 사이트 방문 등 페이지 텍스트에 따른 행동을 피해야 합니다.
5. 브라우저 에이전트가 실행될 때 어떤 증거를 보관하는 것이 유용하며, 무엇을 피해야 할까요?
답변
동작 요약, 타임스탬프, URL, 선택된 요소 설명, 검증 결과, 스크린샷 참조를 보관하여 실행 내용을 검토 가능하게 하세요. 비밀번호, 결제 정보, 세션 쿠키, 원시 개인 정보, 전체 페이지 내용 저장은 특정 보존 및 개인정보 이유가 없으면 피하세요.
추가 자료
이전 강의
Microsoft 에이전트 프레임워크 탐색
다음 강의
확장 가능한 에이전트 배포하기
면책 조항:
이 문서는 AI 번역 서비스 Co-op Translator를 사용하여 번역되었습니다. 정확성을 기하기 위해 노력하고 있으나, 자동 번역은 오류나 부정확한 부분이 있을 수 있음을 유의하시기 바랍니다. 원본 문서의 원어본이 권위 있는 자료로 간주되어야 합니다. 중요한 정보의 경우, 전문가의 인간 번역을 권장합니다. 이 번역 사용으로 인해 발생하는 오해나 잘못된 해석에 대해 당사는 책임을 지지 않습니다.