命令型 API

Alexandra Klepper
Alexandra Klepper

公開日: 2026 年 5 月 18 日

商品の解説 ウェブ 拡張機能 Chrome ステータス インテント
GitHub デベロッパー トライアル デベロッパー トライアル デベロッパー トライアル デベロッパー トライアル 表示 試験運用版のインテント

WebMCP Imperative 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 をお試しになり、フィードバックをお寄せください。