WebMCP는 웹사이트가 AI 에이전트에 의해 호출되는 구조화된 도구로 기능을 노출하기 위해 제안된 웹 표준입니다. 에이전트용 Chrome DevTools를 사용하면 코딩 에이전트가 이러한 도구와 직접 상호작용하여 웹사이트를 WebMCP에 맞게 만드는 방법을 분석하고 제안할 수 있습니다.
에이전트용 DevTools를 사용하면 애플리케이션이 WebMCP 도구를 올바르게 노출하는지 확인하고, 실행을 테스트하고, AI 에이전트가 사이트에서 추가로 노출된 기능을 활용할 수 있는 영역을 식별할 수 있습니다. WebMCP는 Modern Web Guidance에 포함된 에이전트 기술을 사용하여 웹사이트에 구현할 수 있습니다.
WebMCP를 사용할 때는 다음 사항에 유의하세요.
- 실험용 플래그: WebMCP 카테고리는 기본적으로 활성화되어 있지 않습니다.
--categoryExperimentalWebmcp플래그를 사용합니다. 참여에 관한 자세한 내용은 WebMCP 오리진 트라이얼을 참고하세요. - 브라우저 요구사항: 이 기능을 사용하려면 WebMCP 기능이 사용 설정된 Chrome 149 이상이 필요합니다. 즉, 테스트 중인 웹사이트가 WebMCP 오리진 트라이얼에 등록되어 있거나 로컬 Chrome 브라우저에서 해당 WebMCP 플래그를 수동으로 사용 설정한 것입니다.
- 타겟 잠재고객 구분: DevTools MCP 서버는 개발자를 대상으로 하는 디버깅 기능인 반면 WebMCP 도구는 브라우저 에이전트를 사용하여 웹사이트와 상호작용하는 모든 사람이 호출할 수 있습니다. 에이전트용 DevTools를 사용하면 사용자 대상 WebMCP 도구를 빌드하고 테스트할 수 있습니다.
WebMCP 도구 테스트 및 디버깅 사용 사례
WebMCP를 사용하는 방법은 여러 가지가 있습니다. 웹사이트마다 다르고 웹MCP 도구 세트도 다릅니다. 웹사이트 또는 웹 애플리케이션에 유용한 도구를 정의하고 빌드하는 방법에 관한 프레임워크를 따르세요.
예를 들어 사용자의 에이전트가 관련 작업을 완료하는 데 도움이 되는 도구가 있는 여행사 웹사이트가 있는 경우 에이전트가 도구가 의도한 대로 작동하는지 테스트하기 위해 DevTools와 함께 사용할 수 있는 프롬프트의 예는 다음과 같습니다.
테스트와 개발을 간소화하기 위해 WebMCP 도구를 나열하고 실행하도록 에이전트에게 지시하세요.
참고: 에이전트 실행 단계는 잠재적 동작의 예입니다. 다양한 유형의 에이전트가 있고 에이전트는 비결정적이므로 결과가 다를 수 있습니다.
WebMCP 도구 노출 확인
사이트에 WebMCP 지원을 추가하면 코딩 에이전트에게 도구가 브라우저에 올바르게 노출되고 입력 스키마가 잘 정의되어 있는지 확인하도록 요청할 수 있습니다.
프롬프트 예시:
Implement a 'book_flight' WebMCP tool to this page to help agents book flights. Verify that it's correctly registered and ready for AI agents to use.
에이전트 실행 예: 에이전트가 노출된 도구를 검사해야 할 필요성을 감지하고 자율적으로 list_webmcp_tools 도구를 호출합니다. 출력을 파싱하고 도구가 성공적으로 등록되었는지 확인하며 스키마가 형식이 올바른지 검증합니다.
WebMCP 도구 실행 디버그
특정 입력으로 AI가 호출할 때 WebMCP 도구의 내부 로직이 예상대로 작동하는지 확인합니다. 도구를 실행하고 애플리케이션의 응답을 모니터링하도록 에이전트에 지시할 수 있습니다.
프롬프트 예시:
Try using the 'add_to_cart' tool on this page to add product 12345. Let me know if it succeeds or if the application throws any errors.
에이전트 실행 예: 에이전트가 특정 작업을 테스트하려는 의도를 인식합니다. 올바른 입력 스키마를 자율적으로 결정하고 execute_webmcp_tool를 사용하여 실행하며 애플리케이션의 응답(콘솔 로그 확인 포함)을 모니터링하여 성공 상태를 보고하거나 실패를 디버그합니다.
스키마 명확성 문제 해결
AI 에이전트가 WebMCP 도구를 올바르게 호출하지 못하는 경우가 반복되면 모호한 JSON 스키마 때문인 경우가 많습니다. 에이전트에게 LLM의 관점에서 스키마를 검토하고 개선사항을 제안해 달라고 요청할 수 있습니다.
프롬프트 예시:
My 'schedule_meeting' tool is failing to parse the various date formats sent by different AI agents. Can you review the tool's schema and suggest how I can improve the descriptions or constraints so agents know exactly which format is required?
에이전트 실행 예: 에이전트가 노출된 WebMCP 도구를 가져오고 inputSchema에서 'schedule_meeting'을 분석합니다. 날짜 매개변수에 명확한 설명이나 형식 제약 조건이 없음을 확인하고 코드에 구현할 수정된 JSON 스키마 (예: 'Date in
YYYY-MM-DD format'과 같은 설명 추가)를 제안합니다.