BioPlayground

🧬
← AI Tools
multimodalintermediate

WebMCP

WebMCP는 W3C Web Machine Learning Community Group이 2026년 2월 10일에 최초 제안한 브라우저 클라이언트 기반 AI 에이전트 통합 표준 명세로, 웹 페이지 내의 JavaScript 함수나 HTML 폼 요소를 AI 모델이 직접 인지하고 호출할 수 있는 도구 형태로 노출하는 선언적 규격입니다. 기존의 거대언어모델(LLM) 에이전트들이 웹 환경을 조작하기 위해 화면 스크린샷 이미지나 원시 HTML 문서(DOM) 구조를 복잡하게 파싱하고 마우스 클릭을 가상으로 흉내 내는 방식이었다면, WebMCP는

WebMCP는 W3C Web Machine Learning Community Group이 2026년 2월 10일에 최초 제안한 브라우저 클라이언트 기반 AI 에이전트 통합 표준 명세로, 웹 페이지 내의 JavaScript 함수나 HTML 폼 요소를 AI 모델이 직접 인지하고 호출할 수 있는 도구 형태로 노출하는 선언적 규격입니다. 기존의 거대언어모델(LLM) 에이전트들이 웹 환경을 조작하기 위해 화면 스크린샷 이미지나 원시 HTML 문서(DOM) 구조를 복잡하게 파싱하고 마우스 클릭을 가상으로 흉내 내는 방식이었다면, WebMCP는 브라우저가 페이지 자체와 에이전트 간의 정형화된 통신 계약을 중재하게 만듭니다. 텍스트 분석 솔루션에서 GPT 모델이 다양한 자연어 작업을 유기적으로 처리하듯, WebMCP는 웹페이지 내부의 동적 스크립트와 사용자 인터페이스를 구조적 API 형태로 추상화하여 브라우저에 통합된 에이전트가 보다 정확하게 웹 콘텐츠를 제어하도록 돕습니다. 이 표준 사양은 웹 개발자가 웹페이지 내부에 간단히 HTML 태그나 자바스크립트 객체 등록 방식으로 에이전트 친화적인 도구 세트를 제공함으로써, AI 플랫폼과 프론트엔드 환경이 실시간으로 상호작용하는 새로운 패러다임을 제시합니다. 기존에 제안되었던 Anthropic의 Model Context Protocol(MCP)이나 OpenAPI 표준 규격 등은 대부분 웹 브라우저 바깥의 백엔드 서버나 외부 로컬 프로세스 간의 통신(Stdio, SSE 등)을 타깃으로 설계되어, 실시간 브라우저 내 인터랙션과 사용자 상태를 동기화하기에 많은 구조적 한계가 존재했습니다. 예를 들어, 사용자가 이미 웹 브라우저 세션에 로그인하여 세밀하게 화면를 렌더링하고 필터링해 둔 고유한 메모리 상태가 있더라도, 백엔드 중심의 MCP 서버는 이 프론트엔드 컨텍스트를 직접 공유받을 수 없기 때문에 별도의 동기화 서버를 구축하고 인증 처리를 재수행해야 하는 중복 설계 문제가 발생했습니다. 반면 WebMCP는 브라우저 내부 클라이언트 환경에 특화되어 동작하므로, 별도의 중개 서버나 백엔드 구현 없이도 현재 로드된 웹 프로그램 내의 핵심 기능을 직접 도구로 감싸서 브라우저 에이전트에 노출할 수 있습니다. 개발자는 `document.modelContext.registerTool`과 같은 네이티브 API 호출 단 몇 줄만으로 복잡한 클라이언트 사이드 상태 변경 및 UI 갱신 로직을 에이전트에게 도구 계약(Tool Contract) 형태로 전달할 수 있으며, 이는 화면을 크롤링하여 요소를 분석하는 브라우저 자동화 도구들보다 훨씬 압도적인 작동 안정성과 실행 신뢰성을 보장합니다. 생명공학 연구자나 데이터 엔지니어가 대화형 데이터 포털을 활용해 대규모 유전체 분석을 수행하는 가상 시나리오를 통해 이 도구 표준의 가치를 쉽게 이해할 수 있습니다. 기존에 다양한 생물정보학 데이터 포털에서 여러 조건의 데이터를 검색하고 다운로드하기 위해 연구자들은 수십 개의 웹 메뉴를 일일이 탐색하고 클릭하거나, 브라우저가 제공하는 복잡한 검색 쿼리 폼 필드들을 수동으로 채워 넣어야만 했습니다. 만약 해당 데이터 포털이 WebMCP 규격을 페이지에 내장하고 있다면, 연구자는 브라우저 사이드바의 AI 에이전트에게 "염색체 22번 영역에서 전사인자 결합 부위 중 phyloP 보존 점수가 2.5를 초과하는 피크 트랙들만 골라 현재 시각화 화면에 즉시 렌더링해 줘"라고 자연어로 지시할 수 있습니다. 에이전트는 페이지 소스코드를 긁어와 분석하는 대신 포털이 노출한 `filter-genomic-peaks` 도구를 JSON 파라미터 규격에 맞춰 실행하며, 데이터 포털은 내부 자바스크립트 엔진을 통해 비동기 API 요청을 수행하고 즉시 브라우저 캔버스 상의 그래픽을 2초 만에 부드럽게 갱신합니다. 이를 통해 연구자는 수동으로 조작하는 피로도에서 벗어나 고차원적인 발견 작업과 데이터 비교 분석에 오롯이 집중할 수 있게 되며, 웹 서비스 공급업체 입장에서도 자사 웹 UI의 주도권을 유지한 채 브라우저 환경에서 보안과 사용자 경험을 동시에 확보할 수 있는 진보된 상호 작용을 구현하게 됩니다.

💻 필요한 컴퓨터 사양

🧠RAM

해당 없음 (CPU/브라우저 엔진 연산 기반으로 그래픽 메모리 불필요)

💾저장공간

규격 문서 및 브라우저 구현체 설치 공간 외 요구량 없음

⚡ 설치법

### 4-1. Quick Start

```javascript
// WebMCP API를 사용하여 AI 에이전트가 탐색 및 실행 가능한 클라이언트 사이드 도구를 웹페이지 스크립트에 동적으로 등록합니다.
await document.modelContext.registerTool({
  name: "get-genomic-tracks",
  description: "Retrieve specific genomic tracks using gene ID and track size.",
  inputSchema: {
    type: "object",
    properties: {
      geneId: { type: "string" },
      trackSize: { type: "number", default: 1000 }
    },
    required: ["geneId"]
  },
  execute({ geneId, trackSize }) {
    return fetchGenomicData(geneId, trackSize);
  }
});
```

### 4-2. 상세 설치

WebMCP는 W3C 제안 공식 표준 명세서(Bikeshed 포맷)이므로 로컬 명세 빌드 및 문서 갱신을 위해 다음과 같이 리포지토리를 설정합니다:

```bash
# 1. 명세 컴파일러 도구 설치
pip install bikeshed && bikeshed update

# 2. WebMCP 명세 GitHub 리포지토리 복제
git clone https://github.com/webmachinelearning/webmcp.git && cd webmcp

# 3. 명세 HTML 로컬 빌드 컴파일
make
```
📄 공식문서🐙 GitHub

📝 업데이트 노트

아직 업데이트 노트가 없습니다.

🧪 관련 생명의 코드

관련된 생명의 코드 글이 아직 없습니다.