ai-agents-for-beginners

컴퓨터 사용 에이전트(CUA) 구축하기

컴퓨터 사용 에이전트는 사람이 하는 것처럼: 브라우저를 열고, 페이지를 검사하며, 본 것에서 최선의 다음 동작을 수행할 수 있습니다. 이 수업에서는 Airbnb를 검색하고 구조화된 목록 데이터를 추출하며 스톡홀름에서 가장 저렴한 숙박을 찾는 브라우저 자동화 에이전트를 만듭니다.

이 수업은 AI 기반 탐색을 위한 Browser-Use, 브라우저 제어를 위한 Playwright 및 Chrome DevTools 프로토콜(CDP), 시각 인식 추론을 위한 Azure OpenAI, 그리고 구조화된 추출을 위한 Pydantic을 결합합니다.

소개

이 수업에서는 다음을 다룹니다:

학습 목표

이 수업을 완료하면 다음을 할 수 있게 됩니다:

코드 샘플

이 수업에는 하나의 노트북 튜토리얼이 포함되어 있습니다:

사전 준비 사항

설정

노트북에서 사용하는 패키지를 설치하세요:

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=...

아키텍처 개요

이 노트북은 하이브리드 브라우저 자동화 워크플로우를 시연합니다:

  1. CDP가 활성화된 상태로 Chrome을 시작하여 Playwright와 Browser-Use가 동일한 브라우저 세션을 공유합니다.
  2. Browser-Use 에이전트가 Airbnb 열기, 팝업 닫기, 스톡홀름 검색 같은 개방형 탐색 작업을 처리합니다.
  3. 활성 페이지를 구조화된 Pydantic 스키마로 검사하여 목록 제목, 1박 가격, 평가 및 URL을 추출합니다.
  4. Python 로직이 추출된 목록을 비교해 가장 저렴한 결과를 강조합니다.

이 접근법은 Browser-Use가 뛰어난 유연한 시각 기반 추론을 유지하면서도 필요할 때 결정론적 브라우저 제어를 제공합니다.

주요 내용 및 모범 사례

에이전트 vs 액터 사용 시기

시나리오 에이전트 사용 액터 사용
동적 레이아웃 예, AI가 페이지 변경에 적응 가능 아니요, 깨지기 쉬운 선택자 문제
알려진 구조 아니요, 에이전트는 직접 제어보다 느림 예, 빠르고 정확함
요소 찾기 예, 자연어가 잘 작동함 아니요, 정확한 선택자 필수
타이밍 제어 아니요, 예측 불가 예, 대기 및 재시도 완전 제어
복잡한 워크플로우 예, 예상치 못한 UI 상태 처리 가능 아니요, 명시적 분기 필요

Browser-Use 모범 사례

  1. 탐색과 동적 작업에는 에이전트로 시작하세요.
  2. 상호작용이 예측 가능해지면 직접 페이지 제어로 전환하세요.
  3. 추출된 데이터가 검증되고 타입 안전하도록 구조화된 출력 모델을 사용하세요.
  4. 가시적 UI 변화를 일으키는 작업 후에 지연을 전략적으로 추가하세요.
  5. 반복하는 동안 스크린샷을 캡처해 실패 시 디버그하기 쉽게 만드세요.
  6. 웹사이트가 바뀔 수 있음을 예상하고 팝업 및 레이아웃 변경에 대한 대체 전략을 설계하세요.
  7. 유연성과 정밀성을 모두 갖추도록 에이전트와 액터 패턴을 혼합하세요.

브라우저 에이전트 안전 가드레일

브라우저 에이전트는 실시간 웹사이트에서 작동하므로, 알려진 API만 호출하는 스크립트보다 더 엄격한 경계가 필요합니다. 노트북 데모에서 실제 워크플로우로 전환하기 전에 에이전트가 볼 수 있고 클릭하며 제출할 수 있는 것에 대한 제어 조건을 정의하세요.

  1. 탐색 환경 범위 지정: 에이전트를 전용 브라우저 프로필이나 샌드박스에서 실행하고 작업에 필요한 도메인으로 제한하세요.
  2. 관찰과 행동 분리: 에이전트가 먼저 검색, 읽기, 데이터 추출을 수행하게 하고, 양식을 제출하거나 메시지를 보내거나 예약, 구매, 기록 삭제, 계정 설정 변경은 명시적 승인 단계를 거치게 하세요.
  3. 비밀을 프롬프트 및 로그에서 분리: 비밀번호, 결제 정보, 세션 쿠키, 개인 데이터는 모델 컨텍스트에 두지 마세요. 인증은 사용자가 직접 하고 로그에서 민감 필드는 제거하세요.
  4. 페이지 콘텐츠를 신뢰하지 않는 입력으로 취급: 웹사이트는 에이전트를 위한 지시사항을 포함할 수 있습니다. 에이전트는 목표 변경, 데이터 공개, 안전장치 비활성화, 무관 사이트 방문 요청 텍스트를 무시해야 합니다.
  5. 위험한 단계에 대해 결정론적 검증 사용: 최종 승인을 요청하기 전에 현재 URL, 페이지 제목, 선택 항목, 가격, 수신자, 작업 요약을 코드로 확인하세요.
  6. 예산과 중단 조건 설정: 에이전트가 사용할 수 있는 동작, 재시도, 탭, 분 수를 제한하세요. 페이지 상태가 불확실하면 클릭을 계속하는 대신 중단하세요.
  7. 유용한 증거만 기록: 동작 요약, 타임스탬프, URL, 선택된 요소 설명, 스크린샷 참조를 보관해 실패 원인을 리뷰하되 불필요한 민감 페이지 내용은 저장하지 마세요.

Airbnb 샘플에서는 목록 검색과 가격 추출이 안전한 기본값입니다. 로그인, 호스트 연락, 예약완료는 별도의 사용자 승인 작업으로 해야 합니다.

실제 적용 사례

실제 예시: Microsoft Project Opal

이 수업에서 만드는 에이전트는 사람이 하듯 브라우저를 조작하는 프로그램인 컴퓨터 사용 에이전트(CUA)의 작고 지역적인 버전입니다. Microsoft는 Microsoft 365 Copilot의 기능인 Project Opal (Frontier)을 통해 기업용으로 이 아이디어를 확장하고 있습니다.

Project Opal을 사용하면 작업을 설명하면 에이전트가 보안 Windows 365 클라우드 PC에서 컴퓨터 사용을 통해 조직의 브라우저 기반 애플리케이션, 사이트, 데이터를 기반으로 사용자를 대신해 작업합니다. 이 작업은 비동기적으로 백그라운드에서 수행되며 언제든 작업을 안내하거나 제어할 수 있습니다. 예시 작업:

Opal은 실제 프로덕션 환경에서 신뢰할 수 있는 컴퓨터 사용 에이전트의 좋은 참고 사례이며, 이전 수업의 개념들을 강화합니다:

이 과정 내 개념 Project Opal 적용 방식
인간 개입 루프 (수업 06) Opal은 로그인 자격증명, 민감 데이터 또는 애매한 지시 정보를 기다리고, 명시적 확인 없이 비밀번호 입력이나 양식 제출은 하지 않습니다. 작업 중 언제든 제어 인수제어 반환이 가능합니다.
신뢰할 수 있고 안전한 에이전트 (수업 06 & 18) 격리된 Windows 365 클라우드 PC에서 실행되고, 기본적으로 브라우저 전용(다른 컴퓨터 접근 차단, Intune으로 강제), 사용자 신원을 사용해 권한 있는 데이터만 접근하며, 모든 동작은 감사 가능하도록 기록됩니다.
계획 및 메타인지 (수업 07 & 09) Opal은 작업의 계획을 먼저 만들고, 각 단계에서 자신의 추론을 감독하며 의심스러운 활동 감지 시 일시 중지합니다.
재사용 가능한 능력 / 도구 (수업 04) 기술(Skills)은 반복 작업용 지침을 작성하여( .md 파일에서 가져오거나 Opal로 작성) 대화에서 재사용할 수 있도록 합니다.

사용 가능 여부: Project Opal은 현재 Frontier 얼리 액세스 프로그램에 있는 Microsoft 365 Copilot 구독자를 대상으로 제공되며, 관리자가 설정을 완료해야 합니다. 실험적 Frontier 기능이므로 시간이 지남에 따라 기능이 변경될 수 있습니다.

추가 자료

이전 수업

Microsoft 에이전트 프레임워크 탐색하기

다음 수업

확장 가능한 에이전트 배포하기


면책 조항: 이 문서는 AI 번역 서비스 Co-op Translator를 사용하여 번역되었습니다. 정확성을 기하기 위해 노력하고 있으나, 자동 번역은 오류나 부정확한 부분이 있을 수 있음을 유의하시기 바랍니다. 원본 문서의 원어본이 권위 있는 자료로 간주되어야 합니다. 중요한 정보의 경우, 전문가의 인간 번역을 권장합니다. 이 번역 사용으로 인해 발생하는 오해나 잘못된 해석에 대해 당사는 책임을 지지 않습니다.