게시일: 2026년 5월 18일
| 설명하듯이 | 웹 | 확장 프로그램 | Chrome 상태 | 의도 |
|---|---|---|---|---|
| GitHub | View | 실험 의도 |
WebMCP 명령형 API를 사용하여 표준 JavaScript로 다양한 유형의 도구를 정의할 수 있습니다. 도구는 양식 입력, 사이트 탐색, 상태 관리와 같은 다양한 기능을 실행할 수 있습니다.
이 API를 사용하기 전에 예시 사용 사례를 읽어보세요.
모델 컨텍스트 제공
modelContext 인터페이스를 사용하여 도구를 등록합니다. 도구 등록에는 이름, 설명, 관련 속성이 있는 입력 스키마가 필요합니다.
registertool를 사용하여 모델 컨텍스트에 단일 도구를 추가합니다.
WebMCPza Maker
navigator.modelContext.registerTool({
name: 'toggle_layer',
description: 'Control pizza layers (sauce, cheese). Use "add", "remove", or "toggle".',
inputSchema: {
type: 'object',
properties: {
layer: { type: 'string', enum: ['sauce-layer', 'cheese-layer'] },
action: { type: 'string', enum: ['add', 'remove', 'toggle'] },
},
required: ['layer'],
},
execute: ({ layer, action }) => {
toggleLayer(layer, action);
return `Performed ${action || 'toggle'} on layer: ${layer}`;
},
});
주문 상태 가져오기
navigator.modelContext.registerTool({
name: 'get_order_status',
description: 'Search orders in a given timeframe. Returns order number, shipping status and location',
inputSchema: {
"type": "object",
"properties": {
"timeframe": { "type": "string", "oneOf": [
{ "type": "string", "const": "today", "title": "Today" },
{ "type": "string", "const": "yesterday", "title": "Yesterday" },
{ "type": "string", "const": "last_7_days", "title": "Last 7 Days" },
{ "type": "string", "const": "last_30_days", "title": "Last 30 Days" },
{ "type": "string", "const": "last_6_months", "title": "Last 6 Months" }],
"enum": [ "today", "yesterday", "last_7_days", "last_30_days", "last_6_months" ],
"description": "Timeframe for the order lookup." }
},
"required": [ "timeframe" ]
},
execute: ({ timeframe }) => {
// Add your API or database logic here to fetch and return the order data as a string.
},
});
선택적 매개변수로 전달된 경우 AbortSignal를 사용하여 도구를 삭제할 수 있습니다.
const addTodoTool = {
name: "addTodo",
description: "Add a new item to the todo list",
inputSchema: {
type: "object",
properties: { text: { type: "string" } },
},
execute: ({ text }) => {
// You should handle the persistence logic here (omitted for demo)
return `Added todo: ${text}`;
},
annotations: {
readOnlyHint: false,
untrustedContentHint: true
},
};
const controller = new AbortController();
navigator.modelContext.registerTool(addTodoTool, { signal: controller.signal });
// Unregister the tool later...
controller.abort();
참여 및 의견 공유
WebMCP는 현재 논의 중이며 향후 변경될 수 있습니다. 이 API를 사용해 보고 의견이 있다면 언제든지 알려주세요.
- WebMCP 설명서를 읽고 질문을 제기하고 토론에 참여하세요.
- WebMCP 권장사항을 읽어보세요.
- Chrome 상태에서 Chrome 구현을 검토하세요.
- 사전 체험 프로그램에 참여하여 새로운 API를 미리 살펴보고 메일링 리스트에 액세스하세요.
- Chrome 구현에 관한 의견이 있으면 Chromium 버그를 신고하세요.