WebMCPを活用したい

多摩.dev #5 秋の夜長のトーク会(2026/10/16)発表のスライドです。

Transcript

1. WebMCPを 活用したい AIエージェント ツールを呼ぶ Webページが公開しているツール search_catalog() サイトがAIエージェントに「道具」を渡す仕組みを、 update_cart() いまのうちに触っておく話 complete_checkout() 2026.10.16 / massan（まっさん）
2. WebMCP 使ったことありますか？ WebMCPを活用したい 02
3. はじめに WebMCPって使ったことありますか？ 2026年 夏 可能性を感じた 「これは来るのでは…？」 でも 全然流行っていない Web全体のWebMCP使用率 0.86%（2026/10/16時点） 1.0% 0.5% パーソナルAIエージェントでいいじゃん 調べてみたら 各社動き出していた 0% 5月 6月 7月 8月 9月 10月 Chromeで読み込まれたページのうち、WebMCP （document.modelContext）が使われた割合（日次）。7月に急増し、7月下 旬以降は約0.7〜0.9%で推移 今日は、その「動き出している」話をします 出典：Web Platform Status（webstatus.dev）document.modelContext のChrome使用率（2026/5/1〜10/16） 03
4. はじめに 最近、パーソナルAIエージェント流行ってますね！ 全然触れていないんですけれども・・・ WebMCPを活用したい 04
5. でも…… WebMCP、 流行ってなくないですか？ WebMCPを活用したい 05
6. 何故？ 流行っていない理由を、2つ推測してみました WebMCPを活用したい 06
7. なぜ流行らない？ 流行っていないと思われる理由 推測 1 推測 2 そんなツールを入れなくても、もっと 体験の良いものがいっぱいあるから 日本では、エージェンティックコマー スがまだ始まっていないから 先ほど挙げたパーソナルAIエージェントのように エージェンティックコマース：AIが商品を選び、チ ェックアウトまでしてくれる購買体験 WebMCPを活用したい 07
8. WebMCPとは そもそもWebMCPって何ぞや？ Webサイトが、AIエージェント向けの「ツール」を自分で公開するための、提案中のWeb標準 これまで：画面から推測する WebMCP：サイトがツールを宣言する AIエージェント AIエージェント 画面やDOMを読み、 公開されたツールを呼ぶ クリック・入力を再現 （入出力はJSON Schema） Webページ（人間向けの画面） ボタン フォーム 日付ピッカー ページの意図は、エージェントが推測するしかない 出典：developer.chrome.com/docs/ai/webmcp Webページ ＋ ツール checkout filter_results date_pick 何ができるかは、サイト自身が宣言する 08
9. WebMCPとは 2つのAPIで、ページにツールを登録する 命令型API（Imperative） ツール定義のイメージ（簡略化） JavaScriptでツールを定義。フォーム入力・画面遷移・ registerTool({ name: "search_catalog", description: "商品を検索する", inputSchema: { // JSON Schema type: "object", properties: { query: { type: "string" } } }, execute: ({ query }) => search(query), }); 状態管理などに使う 宣言型API（Declarative） HTMLフォームに注釈を付ける。既存のフォームが、そ のままエージェント用のツールになる 提供状況 ローカルで試す 動く場所 Chrome 149からOrigin Trial chrome://flags/#enable-webmcp-testing 人が見ているページ上で動き、結果を確認 できる 出典：developer.chrome.com/docs/ai/webmcp 09
10. 動き出した各社 ① Shopify ShopifyのストアフロントがWebMCPに対応 ストアフロントが公開するツール 2026/8/5 商品検索からチェックアウトへの引き継ぎまで、全10種 Liquid / Hydrogen のストアフロ ントでWebMCPが使える 商品を探す search_catalog browse_store get_product show_variant Liquidストアは設定不要で全店有効 Hydrogenは開発者プレビュー カート get_cart 購入・注文 proceed_to_checkout 店舗情報 search_shop_policies_and_faqs update_cart cancel_cart エージェンティックストアフロントとは 別の対応 日本ではAIエージェント決済が未開始の manage_orders ため、使えるのはテストモードのみ 9/28〜 チェックアウトもWebMCPに対応。購入者の確認後に注文を確定できる（未 検証） 出典：shopify.dev/changelog（8/5） ／ shopify.dev/docs/api/web-mcp ／ shopify.dev/changelog（9/28） 10
11. 動き出した各社 ② OpenAI OpenAIもWebMCPに対応 2026/8/25 ハッカソン ChatGPTデスクトップの内蔵ブラウザ ーがWebMCPに対応 OpenAI WebMCP Challenge 対応サイトのツール（Site tools）を自動で検出 8/25 9/3 9/23 受付開始 応募締切 受賞発表 （予定） 購入や個人情報の共有など、機微な操作の前に 確認 ChatGPT Work と Codex から使える 上位10件に賞金3,000ドル、ChatGPT Pro 1年分など 追加賞品：Shopify・Google Chrome・Netlify・Cloudflare・ Vercel・Render 出典：learn.chatgpt.com/docs/changelog ／ help.openai.com（Site tools） ／ openai.com/ja-JP/webmcp-challenge 11
12. 動き出した各社 ③ Microsoft MicrosoftもWebMCPをテスト公開 webmcp-labs（GitHub） 2026/9/21 WebMCPの実験プロジェクトとサンプル集 Microsoft EdgeがWebMCP実装をテ スト公開 Edge Canary / Dev で試せる WebMCP Explorer Event Search ブラウザ拡張。自律エージェン 宣言型API（HTMLフォーム）の トループ・複数LLMに対応 サンプル Idea Board Contoso Pizza 命令型API（JavaScript）のサ メニュー閲覧から注文・会計ま ンプル。状態に応じてツールが でできるピザ注文サイト about://flags で「WebMCP for testing」を有 効化 EdgeのOrigin Trialは2027/3/30まで 増減 出典：blogs.windows.com/msedgedev（9/21） ／ github.com/MicrosoftEdge/webmcp-labs ／ Microsoft Edge Origin Trials 12
13. 動き出した各社 ④ Chromeエージェント型拡張機能 Google公式のエージェント型拡張機能が登場 できること 2026/10/7? GoogleChromeLabs/webmcp-extension（GitHub） Example Agentic Chrome Extension ツールを自動検出 チャットで操作 ページやiframe内のWebMCPツ サイドパネルで会話し、ツール ールを見つける をページ上で実行 他社のAIも使える 安全に使える Google・OpenAI・Anthropic・ 機密操作のアラート、ツール実 グを有効にして動かす Ollama、オンデバイスモデルに 行ごとの許可 WebMCP Inspectorとは違い、Gemini API以外 も対応 自然言語でWebMCPのツールを使える、 Google公式のChrome拡張機能 UIは Gemini in Chrome のようなサイドパネル Chrome 150以降で、WebMCPのテスト用フラ の他社製API対応 出典：github.com/GoogleChromeLabs/webmcp-extension 13
14. 動き出した各社 ⑤ Chrome Origin Trial Origin Trialの終了が、Chrome 162まで延長 当初のOrigin Trial期間 延長分（＋6バージョン） Chrome 149 Chrome 156 Chrome 162 Origin Trial開始（2026年6月） 当初のOT終了予定 延長後のOT終了（2027年1月ごろ※） 9/28 Intent to Extend Experiment（blink-dev） 予想 Origin Trialのフィードバックを受けてAPIを改善中の 正式版は、早くても年明け（2027年1月以降）？ ため、検証期間を延長 ※Chrome 162の時期は、9月から始まった2週間リリースから単 純計算した目安 出典：chromestatus.com/feature/5117755740913664 ／ blink-dev（9/28） ／ Chrome 2週間リリース 14
15. 今後の展望 ここまでの流れと、これから これまで（2026年） 6月 8/5 8/25 9/21 9/28 10月 Chrome 149で Origin Trial開始 Shopify ストアフロン トが対応 ChatGPT デスクトッ プが対応／ハッカソン 開始 Microsoft Edge がテス ト公開 Shopify チェックアウ ト対応／OT延長 Google公式の エージェ ント拡張 これから Chrome Edge 日本のコマース OT終了（Chrome 162）を経て、 Origin Trialは2027/3/30まで エージェント決済が始まれば、一 正式版へ？ Chromium系ブラウザで足並みがそろ 気に実用へ？ 延長期間中にAPIの改善が入る予定 うか Shopifyは購入までの流れがWebMCPでつ ながっている WebMCPを活用したい 15
16. なんか色々始まりそう！ 今のうちに触っておきたい！！ WebMCPを活用したい 16
17. 実際に使ってみた ※デモを見せられない場合動画を準備しましょう WebMCPを活用したい 17
18. まとめ WebMCPは、今のうちに触っておきたい 01 サイトが、AIエージェントに「道具」を渡す仕組み 画面を推測させるのではなく、できることをツールとして宣言する 02 2026年夏、主要プレイヤーが一斉に動き出した Shopify・OpenAI・Microsoft・Google。ChromeはOrigin Trialを延長してAPIを改善中 03 日本でエージェンティックコマースが始まる前に、触っておく Shopifyのテストモードや公式の拡張機能で、今すぐ試せる WebMCPを活用したい 18
19. さいごに 自己紹介 SNS名：まっさん（massan） 所属：ブリューエン株式会社 趣味：ゲーム（インディー）で遊ぶこと、 ローカルLLM、ウォーキング、飲み会 X（@massan_mrk） WebMCPを活用したい 19