AI 에이전트를 위한 브라우저 자동화: 실제로 작동하는 방법

원래 dylanworrall.com에 게시되었습니다.

브라우저를 사용하는 대부분의 에이전트 데모는 이유가 있습니다. 한 번에 촬영되기 때문입니다. 브라우저 자동화를 '신뢰성 있게' — 즉, 사람이 통제하지 않는 사이트에서 수백 번, 무인으로 실행하려고 하는 순간 — 그것은 더 이상 데모가 아니라 공학적 문제가 됩니다. 저는 Froots 내부의 브라우저 레이어를 구축하면서 이 문제에 많은 시간을 할애했고, 몇 가지 패턴이

해결책은 하나의 원칙을 지키는 것입니다: 쓰기(write) 작업은 반드시 읽기(read) 작업으로 확인되어야 합니다. 필드를 채운 후에는 다시 읽어보세요. 제출(submit) 버튼을 클릭한 후에는 URL이 변경되거나 성공 노드(success node)가 나타날 때까지 기다리세요. 소리 없는 성공은 진짜 성공이 아닙니다.

읽기 작업을 위해 세션 자체의 쿠키를 사용하세요

많은 유용한 데이터가 로그인 뒤에 숨겨져 있습니다. 로그인 벽을 스크래핑(scraping)하려 애쓰기보다, 올바른 Origin에서 credentials: 'include' 옵션을 사용하여 페이지 내 fetch를 수행하세요. 이렇게 하면 재인증을 하거나 자격 증명(credentials)을 저장할 필요 없이 기존 세션을 재사용할 수 있습니다. 인증된 데이터에 접근하기 전에 로그인 쿠키를 확인하여, 에러 페이지를 조용히 스크래핑하는 대신 사용자에게 로그인을 요청할 수 있도록 하세요.

스크린샷은 정직한 대안입니다

DOM이 까다로운 경우 — 섀도우 루트(shadow roots), 캔버스 UI (canvas UIs), 난독화된 클래스 이름 (obfuscated class names) 등 — 셀렉터(selectors)와 싸우는 것을 멈추고 스크린샷을 찍으세요. 페이지의 사진을 읽는 비전 모델 (vision model)이 때로는 가장 견고한 경로가 될 수 있습니다.

핵심 교훈

신뢰할 수 있는 브라우저 자동화는 영리한 셀렉터에 관한 것이라기보다 루프를 닫는 것 (closing the loop), 즉 행동하고, 관찰하고, 확인하며, 검증하지 않은 결과는 절대 신뢰하지 않는 것에 관한 것입니다.

저는 에이전트 아키텍처(agent architecture) — 신뢰할 수 있는 메모리 (reliable memory), 작업 과정을 지켜볼 수 있는 에이전트 (agents you can watch work), 그리고 1인 기업을 향한 구축 (building toward a one-person company) — 에 대해 제 블로그에서 더 자세히 다룹니다.

— Dylan Worrall, Froots 창립자