웹 페이지가 AI 에이전트용 도구를 공개하기 전에 다른 코드도 호출할 수 있는 클라이언트 API를 마련해야 한다는 주장이 나왔다. 글쓴이는 이 구상을 구현한 실험적 라이브러리 glottis를 소개하며, API를 먼저 만들면 같은 함수를 웹 페이지와 에이전트가 함께 사용할 수 있다고 설명한다.
글쓴이가 든 사례에서는 선물 안내 사이트가 상점 페이지를 숨겨진 iframe으로 열고, 상점이 공개한 addToCart 함수로 상품을 장바구니에 담는다. 상점은 장바구니 변경을 콜백으로 알려준다. 안내 사이트는 계정 정보나 비밀번호를 보지 않고, 상점이 제공하기로 한 정보와 기능만 이용한다.
글쓴이는 WebMCP가 브라우저 안에서 에이전트가 페이지의 도구를 직접 호출하게 하지만, 코드에서 호출할 때는 JSON을 입력하고 문자열을 받는 구조라 콜백이나 객체를 주고받는 API로 쓰기에는 불편하다고 본다. 따라서 에이전트 전용 도구보다 다양한 호출자가 사용할 수 있는 API를 먼저 만들고, 에이전트 도구는 그 API에서 제공하자는 제안이다.
glottis는 페이지 간 함수와 콜백, 메서드가 있는 객체를 전달하는 방식을 제공한다. 상점은 연결을 허용할 사이트를 지정하고, 필요하면 자체 UI에서 방문자에게 먼저 허가를 요청할 수 있다. 다만 다른 사이트의 iframe에서는 쿠키가 제한될 수 있어 처음에는 로그아웃 상태로 시작하며, 세션이 필요하면 한 번의 클릭으로 저장소 접근 권한을 요청할 수 있다.
에이전트에 공개할 함수는 tool()로 감싸 설명과 입력 스키마를 지정하고, webMcp 클라이언트를 활성화한다. 이렇게 하면 함수가 WebMCP 도구로 등록되는 동시에 일반 코드에서도 호출 가능하다. tool()로 감싸지 않은 함수는 코드에는 공개되지만 에이전트에는 보이지 않는다.
글쓴이는 객체의 메서드를 에이전트용 도구로 바꾸는 ‘바인딩된 도구’도 실험적으로 제안한다. 예를 들어 openCart()가 장바구니 객체를 반환하면 그 객체의 add 메서드가 해당 장바구니에 연결된 도구가 된다. 에이전트가 후속 호출마다 장바구니 ID를 복사해 전달할 필요가 없다는 설명이다. 글쓴이는 Claude를 작은 테스트 상점에 연결했을 때 잘 작동했다고 전했지만, 기능은 초기 단계라 실험적으로 표시돼 있다.
WebMCP는 초안이며 Chrome에서는 플래그를 켜야 사용할 수 있다. iframe 안의 페이지가 도구를 제공하려면 상위 페이지들이 모두 tools 권한을 허용해야 하는데, 이를 허용하지 않는 호스트도 있다. 글쓴이는 glottis가 postMessage를 사용하므로 WebMCP의 현재 제약과 별개로 페이지 API를 제공할 수 있다고 설명한다.
glottis는 MIT 라이선스의 0.x 버전이며, 글쓴이는 변경될 수 있다고 밝혔다. 설치 방법은 npm install glottis이며, 프로젝트는 GitHub 저장소와 npm 패키지에서 확인할 수 있다. 브라우저에서 스크립트 태그로 불러오는 방법도 제시했다.
<script src="https://unpkg.com/glottis@0/dist/glottis.min.js"></script>
댓글 (0)
로그인하면 이 기사에 내 생각을 남길 수 있어요