エージェント向けのウェブサイト
WebMCP を使用して、AI エージェントとの連携を強化したサイトを構築します。
WebMCP の仕組み
3 つのステップで、エージェントが実行できることをサイトに正確に伝えることができます。
ステップ 1
サイトでツールを登録する
サイトは、エージェントが実行できるアクションを WebMCP ツールとして宣言します。各ツールには、名前、説明、JSON スキーマがあります。
// Imperative API document.modelContext.registerTool({ name: "bookSlot", title: "Book a consultation slot", description: "Reserve a 30-minute consultation.", inputSchema: { type: "object", properties: { date: { type: "string", format: "date" }, time: { type: "string" }, name: { type: "string" }, email: { type: "string", format: "email" } }, required: ["date", "time", "name", "email"] }, annotations: { readOnlyHint: false }, execute: async (input, client) => { return await api.book(input); } });
ステップ 2
ブラウザはそれらを公開します。
ブラウザは、ページの URL、タイトル、オリジン権限スコープとともに、これらのツールをユーザーの WebMCP 対応エージェントに収集して提示します。
ステップ 3
エージェントが迅速かつ確実にアクションを実行する
エージェントは契約を確認し、構造化された引数を提供します。残りの処理はコードが行います。ユーザーは権限と確認のループに留まります。作動よりも高速で信頼性が高い。
// the agent's view { "tool": "bookSlot", "arguments": { "date": "2026-07-31", "time": "14:00", "name": "Jerry Jones", "email": "jerry.jones@example.com" } }
エージェント向けにサイトを最適化する
ユーザーのニーズとサイトの機能に合った安全なツールを作成します。
WebMCP を使用する場合
ユーザーとエージェントの視点から例を読み、クリティカル ユーザー ジャーニー（CUJ）をサポートする WebMCP ツールを理解します。
WebMCP 戦略を計画する
他のソフトウェア アプリケーションと同様に、最初のステップはツール戦略を計画することです。
効果的なツールを構築する
ウェブサイトやウェブ アプリケーションに役立つ WebMCP ツールを定義して構築する方法について説明します。
WebMCP ツールのセキュリティ
WebMCP を使用してツールを構築する方向けの、セキュリティに関する初期ガイダンスをご覧ください。
AI エージェントで構築する
最新のウェブ ガイダンス
お好みの AI コーディング エージェントで Modern Web Guidance を使用すると、お好みのワークフローでウェブのベスト
プラクティスにアクセスできます。
npx modern-web-guidance@latest install
コーディング エージェントを使用して拡張機能を構築する
Modern Web Guidance を使用して、コーディング エージェントの助けを借りて拡張機能を迅速に構築します。
エージェント デベロッパー向けの安全性に関する考慮事項
エージェント デベロッパーは、信頼できないコンテンツからの悪意のあるテキストに対する保護機能を設計する必要があります。WebMCP を使用するエージェントに関連するセキュリティ技術を特定します。
Gemini in Chrome のご紹介
ブラウザに直接組み込まれた AI アシスタント開いているタブのコンテキストに基づいて、要点をまとめたり、複雑な概念を説明したり、疑問を解決したりしてくれます。
Gemini は複数の Google アプリと連携し、日々の作業を効率化してくれます。