WebMCP

Alexandra Klepper
Alexandra Klepper
GitHub Bluesky

게시일: 2026년 5월 18일

WebMCP는 AI 에이전트를 위한 구조화된 도구를 빌드하고 노출하는 데 도움이 되는 제안된 웹 표준입니다. WebMCP는 에이전트가 페이지 기능과 정확하게 상호작용하여 사용자의 환경을 지원할 수 있도록 JavaScript를 제공하고 HTML 양식 요소를 주석 처리합니다. 이렇게 하면 에이전트 작동의 성능과 안정성이 크게 향상될 수 있습니다.

AI 에이전트는 비교적 새로운 기술입니다. 인간 사용자가 매우 복잡하고 기술적인 작업을 더 잘 완료할 수 있도록 지원합니다. WebMCP는 에이전트 작업 완료의 정확도를 높여주며 점진적 개선으로 추가할 수 있습니다.

WebMCP를 사용해야 하는 이유

WebMCP는 상호작용 규칙을 제공하여 웹 애플리케이션과 에이전트 간의 격차를 해소하고 효율성, 안정성, 작업 완료를 개선할 수 있습니다. 상담사가 버튼이나 필드와 같은 요소를 검토하여 용도를 파악하는 대신 웹사이트에서 요소의 용도를 선언하여 올바르게 사용되도록 합니다.

이는 여러 단계가 있을 수 있고 각 단계를 에이전트가 해석할 수 있는 실행보다 더 안정적입니다.

웹사이트는 tool을 정의하여 검색이나 구매와 같은 명시적인 목적을 공유할 수 있습니다. 이러한 도구는 웹페이지에서 눈에 띄게 실행되므로 사용자는 작업이 예상대로 완료된다는 신뢰를 얻을 수 있습니다. 또한 브랜드와 인간 중심 디자인 선택사항도 그대로 유지됩니다.

WebMCP는 다음을 지원합니다.

  • 디스커버리: 페이지가 checkout 또는 filter_results과 같은 에이전트에 도구를 등록하는 표준 방식입니다.
  • JSON 스키마: 입력 및 예상 출력을 명시적으로 정의하여 과장 또는 오해를 줄입니다.
  • 상태: 현재 페이지 컨텍스트에 대한 공유된 이해로, 에이전트가 실시간으로 조치를 취할 수 있는 리소스를 알 수 있습니다.

Google의 목표는 에이전트 기능을 갖춘 모든 브라우저가 구현하고 활용할 수 있는 API를 빌드하여 사용자가 작업을 더 쉽게 완료할 수 있도록 하는 것입니다. GitHub에서 이 프로세스를 따라갈 수 있습니다.

사용 사례

웹에서 WebMCP를 사용하는 방법은 다양합니다. 예를 들면 다음과 같습니다.

  • 고객이 지원을 받을 수 있도록 지원 고객에게 소프트웨어를 제공하는 경우 다양한 질문에 답변하기 위한 복잡한 지원 흐름이 있을 수 있습니다. WebMCP를 사용하면 상담사가 올바른 양식으로 더 빠르게 이동하고 사용자 제공 정보로 필드를 채울 수 있습니다.
  • 여행 예약 개선 상담사가 더 적은 단계로 복잡한 다구간 및 다인승 여행을 예약할 수 있도록 지원합니다.

구매와 같은 일부 작업은 민감할 수 있습니다. 확인 대화상자를 통해 사용자 상호작용을 요청하는 명령어를 포함할 수 있습니다.

실제로 도구는 다음 작업을 수행할 수 있습니다.

  • 구조화된 양식 작성: 상담사가 사용자와의 대화에서 수집한 데이터를 양식 필드에 올바르게 매핑할 수 있도록 submit_application 도구를 빌드합니다. 예를 들어 필드에 성명이 필요한지 아니면 성과 이름이 별도로 필요한지 구분할 수 있습니다.
  • 사람 중심 인터페이스에서 지원 상담사 상호작용: 특정 필드는 사람 사용자를 위해 설계되었지만 에이전트가 이해하지 못할 수 있습니다. 예약 또는 이벤트 예약에서 복잡한 날짜 및 시간 선택을 허용하는 date_pick 도구를 빌드할 수 있습니다.
  • 더 빠른 애플리케이션 디버깅: 개발자 설정 페이지에서 run_diagnostics 도구를 빌드할 수 있으므로 에이전트가 중첩된 메뉴 뒤에 숨겨진 수정사항을 트리거할 수 있습니다.

사용 사례가 누락되었나요? 아니면 WebMCP에 대해 공유하고 싶은 아이디어가 있으신가요? 사전 체험 프로그램에 참여하여 의견을 공유하세요.

시작하기

WebMCP는 로컬 개발을 위한 Chrome 신고로 제공됩니다. Chrome 149의 오리진 트라이얼에서 사용할 수 있습니다.

로컬에서 WebMCP를 사용 설정하려면 다음 단계를 따르세요.

  1. Chrome을 열고 chrome://flags/#enable-webmcp-testing로 이동합니다.
  2. 플래그를 Enabled로 설정합니다.
  3. Chrome을 다시 실행하여 변경사항을 적용합니다.

WebMCP API 사용

웹사이트 도구를 설정하는 데 사용할 수 있는 API는 두 가지입니다.

  • 명령형 API: 양식 입력, 탐색 도구, 상태 관리 또는 기타 기능과 같은 다양한 유형의 도구를 표준 JavaScript로 정의합니다.
  • 선언적 API: 표준 HTML 양식에 주석을 추가하여 WebMCP 도구를 만듭니다.

제한사항

WebMCP는 상담사와 사람이 복잡한 작업을 더 간단하게 처리할 수 있도록 지원하지만 몇 가지 제한사항이 있습니다.

  • 브라우징 컨텍스트 필요: 도구 호출은 JavaScript에서 처리되므로 표시되는 인터페이스와 브라우저 컨텍스트를 제공하려면 브라우저 탭이나 WebView를 열어야 합니다. 즉, 헤드리스 상태에서 도구를 호출하는 에이전트나 지원 도구는 지원되지 않습니다.
  • 복잡한 인터페이스의 오버헤드 증가: 사이트가 매우 복잡한 경우 애플리케이션 및 인터페이스 상태를 처리하기 위해 JavaScript를 리팩터링하거나 추가해야 할 수 있습니다.
  • 도구 검색 가능성: 클라이언트와 브라우저가 호출 가능한 도구가 있는지 확인하려면 사이트를 직접 방문해야 합니다.

데모

명령형 및 선언적 구현을 모두 다루는 데모의 예는 다음에서 확인할 수 있습니다.

GitHub에서 데모 소스 코드를 검토하고 살펴볼 수도 있습니다.

인스펙터 확장 프로그램으로 상담사 채팅 모방

모델 컨텍스트 도구 검사기 확장 프로그램 설치를 통해 에이전트를 실험하고 라이브 데모 또는 자체 애플리케이션에서 WebMCP 도구가 어떻게 작동하는지 확인하세요. 자연어 프롬프트를 입력하여 에이전트가 WebMCP 도구와 올바르게 상호작용할 수 있는지 확인할 수 있습니다.

확장 프로그램을 사용하면 다음 작업을 할 수 있습니다.

  • navigator.modelContext API를 모니터링하여 페이지에 등록된 도구를 확인합니다.
  • 도구를 수동으로 호출하고 함수를 실행합니다.
  • JSON 스키마가 올바르게 정의되어 있고 브라우저가 도구에서 예상하는 대로 데이터를 파싱할 수 있는지 확인합니다.
  • 도구에서 반환된 구조화된 출력 또는 오류 메시지를 확인하여 에이전트가 이해할 수 있도록 명확하게 작성되고 형식이 올바르게 지정되었는지 확인합니다.

자연어를 사용하여 에이전트와 대화하여 적절한 WebMCP 도구를 올바르게 식별하고 호출할 수 있는지 확인합니다. 프롬프트는 기본적으로 gemini-3-flash-preview 모델로 전송됩니다.

참여 및 의견 공유

WebMCP는 현재 논의 중이며 향후 변경될 수 있습니다. 이러한 API를 사용해 보고 의견이 있다면 언제든지 알려주세요.