📕

## MCPとWeb開発の共通点を探る:『やさしいMCP入門』とWeb基礎知識のつながり

に公開

はじめに

こんにちは。これまでは『やさしいMCP入門』を読んで、AIエージェントとMCPの仕組みについて学んできました。今回は、少し視点を変えて『PythonでつくるWebアプリのつくり方』を読み進め、Webの基礎知識を学びました 。

Webの仕組みを学ぶ中で、以前ブログにまとめたMCPの概念と多くの共通点があることに気づきました。本記事では、このWeb開発の基礎知識をMCPの視点から再解釈し、両者のつながりを整理します。

1. Webアプリの基本:クライアント・サーバモデルとHTTP

AIの考えるクライアント・サーバモデル

Webアプリは、クライアント(Webブラウザ)とサーバ(Webサーバ)間の通信によって動作します 。この仕組みは「クライアント・サーバモデル」と呼ばれ、機能を提供するサーバと、それを利用するクライアントという役割に分かれています 。

このクライアントとサーバ間の通信は、**HTTP(Hypertext Transfer Protocol)というプロトコルに則って行われます 。クライアントがサーバにリクエスト(要求)を送信し、サーバがレスポンス(応答)**を返すことで、Webページが表示されます 。

HTTPの大きな特徴の一つは、そのステートレス(stateless)な性質です 。つまり、各リクエストとレスポンスは独立しており、サーバは通信状態を保持しません。このため、ユーザーのログイン状態や買い物かごの中身などを維持するには、Cookieセッションといった仕組みが必要になります 。

2. MCPの用語をWeb開発の視点から再解釈する

Webアプリの基礎を学ぶと、MCPを構成する用語や仕組みがより深く理解できます。

ホスト・クライアント・サーバの関係性

MCPのアーキテクチャは、「ホスト」「クライアント」「サーバ」の3つの役割で構成されています 。

  • ホスト: AIアプリを指し、Web開発におけるWebブラウザ(フロントエンド)に相当します。
  • ユーザーの指示を受け取り、LLMを通じて機能を拡張します。
  • クライアント: LLMの指示をサーバに伝える「処理の依頼人」です 。
  • サーバ: Web開発におけるWebサーバやアプリケーションサーバに相当し、LLMに情報を提供したり、実際の操作を指示したりします 。

つまり、MCPはWebのクライアント・サーバモデルを、AIエージェントの世界に持ち込んだものと捉えることができます。

通信方式のつながり

MCPクライアントとMCPサーバ間の通信には、Streamable HTTPという方式が使われます。これは、Webブラウジングで普段使われているHTTPを介して通信を行う方法です 。この点からも、MCPがWebの基本的な通信技術を土台にしていることがわかります。

ステートレスなHTTPとコンテキストの管理

以前の記事で、MCPはRAGやFunction callingと異なり、コンテキスト(文脈情報)を提供する規格だと学びました。これは、Web開発におけるステートレスなHTTPに対し、セッションクッキーを使って状態を保持する仕組みに似ています。

MCPがLLMに与えるコンテキストは、Webアプリがセッションに保存する「ユーザー情報」や「買い物かごの中身」と同じように、複数のやり取りをまたいで状態を維持するために不可欠な情報と言えるでしょう。

3. HTTP通信とMCPのStreamable HTTPを比較する

HTTP通信の流れを学んだうえで、Streamable HTTPとの違いと共通点はあるのか? HTTPと共通点が多ければ理解しやすいよなーと感じて、この点を比較してみました。

WebのHTTP通信

WebブラウザがWebサーバーからHTMLファイルを取得する一連の流れは、以下のようになります。

  1. DNS解決: ブラウザが、アクセスしたいドメイン名(例: a.example.com)に対応するIPアドレスをDNSサーバーに問い合わせて取得します。
  2. TCP接続: 取得したIPアドレスに対して、ブラウザがTCP接続を確立します 。
    3. HTTPリクエスト送信: 接続が確立された後、ブラウザは「GET /index.html」といった形式で、目的のリソースを要求するHTTPリクエストをWebサーバーに送信します。
  3. レスポンスと切断: Webサーバーはリクエストを解析し、index.htmlファイルを見つけてその内容をHTTPレスポンスとして返信します 。その後、TCP接続は切断されます 。
  4. 表示: クライアントは受け取ったHTMLファイルを解析して画面に表示します。

このプロセスは、リクエストとレスポンスが1回ずつ行われる、単純でステートレスな通信を基本としています。

MCPのStreamable HTTP

MCPは、AIアプリとツールを接続するためのプロトコルであり、その通信にはWebのHTTPを利用したStreamable HTTPが使われます。この方式は、MCPホストとMCPサーバが同一コンピュータ上で動作しない場合や、MCPサーバの機能を第三者に提供する場合に利用されます。

Streamable HTTPは、HTTPを介して通信を行うため、WebのHTTP通信と同様に、リクエストとレスポンスの概念に基づいています。しかし、WebのHTTPが主に単一のリクエストとレスポンスで完結するのに対し、MCPでは**「プリミティブ」と呼ばれる標準的な機能を通信でやり取りします 。これらのメッセージはJSON-RPC2.0**という形式に従っており、これによりクライアントとサーバ間で双方向の通信を実現し、より複雑な処理を柔軟に行うことができます。

HTTP通信の具体的な流れとMCPのStreamable HTTPを比較_まとめ

WebのHTTP通信とMCPのStreamable HTTPは、どちらもクライアント・サーバモデルHTTPプロトコルを基盤としています。しかし、WebのHTTP通信が主に静的なコンテンツの取得など、単発のやり取りに特化しているのに対し、MCPのStreamable HTTPは、JSON-RPC2.0を利用することで、AIエージェントがツールを呼び出し、その結果を扱うといった双方向かつ複雑な処理を可能にしている点が大きな違いです。

まとめ

『PythonでつくるWebアプリのつくり方』を読んでWebの基本を学ぶことで、クライアント・サーバモデルHTTPステートレス性といった概念が、MCPの仕組みを理解する上で不可欠な基礎知識であることがわかりました 。

MCPは、AIと外部サービスを接続する新しいプロトコルでありながら、その背後にはWeb開発の長い歴史で培われてきた技術や概念が応用されています。用語の混乱を避けるためにも、今後もMCPとWeb開発の知識を並行して学び、互いに関連付けながら理解を深めていきたいと思います。

参考文献

「Pythonでつくる Webアプリのつくり方」 著)クジラ飛行机、 杉山 陽一、遠藤 俊輔 
https://www.socym.co.jp/book/1496
「やさしいMCP入門 」 著) 御田 稔, 大坪 悠
https://www.shuwasystem.co.jp/book/9784798075730.html

Discussion