WebMCP

Alexandra Klepper
Alexandra Klepper
GitHub Bluesky

게시일: 2026년 5월 18일, 최종 업데이트: 2026년 6월 9일

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

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

설명하듯이 웹 확장 프로그램 Chrome 상태 의도
GitHub 오리진 트라이얼 오리진 트라이얼 View 실험 의도

WebMCP를 사용하는 이유

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

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

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

WebMCP는 다음을 지원합니다.

  • 탐색: 페이지가 checkout 또는 filter_results와 같은 도구를 에이전트에 등록하는 표준 방법입니다.
  • JSON 스키마: 환각 또는 오해를 줄이기 위한 입력 및 예상 출력의 명시적 정의입니다.
  • 상태: 현재 페이지 컨텍스트에 대한 공유 이해로, 에이전트가 실시간으로 작업할 수 있는 리소스를 알 수 있습니다.

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

사용 사례

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

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

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

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

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

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

시작하기

WebMCP 오리진 트라이얼 에 Chrome 149부터 참여하세요. 오리진 트라이얼을 시작하는 방법을 자세히 알아보세요.

로컬 WebMCP

WebMCP는 로컬 개발을 위한 Chrome 신고로 제공됩니다.

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

WebMCP API 사용

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

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

제한사항

WebMCP는 에이전트와 인간을 위해 복잡한 작업을 더 간단하게 만드는 것을 목표로 하지만 몇 가지 제한사항이 있습니다.

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

보안 및 권한

WebMCP API는 오리진 격리 요구사항과 권한 정책으로 관리됩니다.

오리진 격리

WebMCP는 오리진 격리된 문서에서만 사용할 수 있습니다. 이렇게 하면 도구의 수명 동안 문서의 오리진이 안정적으로 유지됩니다.

문서에 document.domain이 사용 설정되어 있는 경우 (예: Origin-Agent-Cluster: ?0 HTTP 헤더 사용) WebMCP API가 사용 중지됩니다.

권한 정책

두 API 모두 tools 권한 정책으로 관리됩니다. 정책은 기본적으로 self로 설정되어 최상위 및 동일 오리진 컨텍스트에서 도구 등록을 허용하고 교차 오리진 iframe에서는 사용 중지합니다.

교차 오리진 iframe에서 WebMCP 도구를 허용하려면 iframe에 allow="tools" 속성을 추가합니다.

데모

명령형 구현과 선언적 구현을 모두 다루는 데모의 예는 다음과 같습니다.

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

검사기 확장 프로그램으로 에이전트 채팅 모방

모델 컨텍스트 도구 검사기 확장 프로그램 을 설치하여 에이전트를 실험하고 WebMCP 도구가 실시간 데모 또는 자체 애플리케이션에서 어떻게 작동하는지 확인합니다. 자연어 프롬프트를 사용하여 에이전트가 WebMCP 도구와 예상대로 상호작용하는지 확인합니다.

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

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

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

참여 및 의견 공유

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