Chrome DevTools의 WebMCP 패널을 사용하여 웹사이트가 AI 에이전트에 노출하는 클라이언트 측 AI 도구를 검사, 디버그, 테스트합니다. 이 패널은 등록, 스키마 유효성 검사, 호출 기록을 비롯한 도구 수명 주기에 대한 완전한 엔드 투 엔드 가시성을 제공합니다.
WebMCP 창 열기
WebMCP 창은 애플리케이션 패널 내에 있습니다. 이 창을 열려면 다음 단계를 따르세요.
- WebMCP 도구를 사용하는 페이지에서 Chrome DevTools를 엽니다.
- 애플리케이션 탭을 클릭합니다.
- 사이드바의 최상위 수준에서 WebMCP 창을 선택합니다.
인터페이스 개요
WebMCP 패널은 도구를 관리하고 모니터링하는 데 도움이 되는 듀얼 창 레이아웃을 사용합니다.
- 호출된 도구: AI 에이전트와 페이지 간의 상호작용을 시간순으로 기록합니다.
- 사용 가능한 도구: 활성 탭에서 감지된 모든 WebMCP 도구의 실시간 목록입니다.
사용 가능한 도구
사용 가능한 도구 섹션에는 AI 에이전트에 표시되는 도구 이름과 설명이 표시됩니다. 또한 각 도구의 호출 카운터 도 포함되어 있으며, 현재 세션 중에 도구가 호출된 횟수를 보여줍니다.
호출된 도구
호출된 도구 로그는 도구 상호작용의 영구 기록을 제공합니다. 로그에서 항목을 선택하면 다음 세부정보를 검사할 수 있습니다.
- 상태: 호출 결과 (완료됨, 취소됨, 진행 중 또는 오류)
- 입력: 에이전트가 예측하여 도구에 전송한 정확한 매개변수입니다.
- 출력: 도구에서 제공하는 반환 값 또는 오류 메시지입니다.
로그 필터링
필터 표시줄을 사용하여 다음 기준에 따라 호출된 도구 목록의 범위를 좁힙니다.
- 이름 또는 설명: 특정 이름 또는 목적과 일치하는 도구를 찾으려면 텍스트를 입력합니다.
- 상태 유형: 완료됨, 오류, 취소됨 또는 진행 중과 같은 현재 상태별로 호출을 필터링합니다.
- 도구 유형: HTML에 정의된 선언적 도구와 JavaScript에 정의된 명령형 도구를 필터링하려면 선택합니다. 모든 도구 유형을 보려면 필터가 활성화되어 있지 않은지 확인합니다.
도구 수동 테스트
AI 에이전트의 결정 로직을 우회하여 도구의 안정성을 독립적으로 테스트할 수 있습니다. 이는 특정 에이전트 프롬프트를 기다리지 않고 함수 로직을 확인하는 데 유용합니다.
- 사용 가능한 도구 목록에서 테스트할 도구를 클릭합니다. 또는 호출된 도구 로그에서 도구 위로 마우스를 가져가 재생 (➜) 아이콘을 표시하고 클릭합니다. 수동 테스트 영역이 열립니다. 참고: 사용 가능한 도구 목록에서 도구를 선택한 경우 수동 테스트 영역의 매개변수가 비어 있습니다. 호출된 도구를 선택한 경우 해당 세션의 매개변수가 미리 채워진 수동 테스트 영역이 열립니다.
- 수동 테스트 영역에서 입력 필드에 매개변수를 입력하거나 조정합니다.
- 도구 실행 을 클릭합니다.
통합 문제 해결
WebMCP 패널은 일반적인 통합 실패를 진단하는 데 도움이 됩니다.
- 스키마 위반: 도구 매개변수 또는 반환 값이 정의된 스키마와 일치하지 않으면 출력 창에 오류 메시지가 표시됩니다.
- 에이전트 거부: 사용 가능한 도구 목록에서 호출 카운터를 확인하여 에이전트가 특정 프롬프트에 도구를 고려했는지 확인합니다.
자동화 및 에이전트
WebMCP는 AI 에이전트가 사이트의 도구를 검색하고 상호작용할 수 있는 에이전트 웹을 위해 설계되었습니다. 에이전트 지원 개발을 위해 Chrome 에이전트용 DevTools 프로젝트는 이 프로토콜을 사용하여 AI 에이전트가 WebMCP 도구를 테스트하고 사용할 수 있도록 지원하는 특수 인터페이스를 제공합니다.
명령줄 플래그
일부 에이전트 인터페이스에서는 --categoryWebMCP 플래그를 명시적으로 사용 설정해야 합니다.
관련 리소스
WebMCP 및 에이전트 웹에 관해 자세히 알아보려면 다음 리소스를 참고하세요.