メインコンテンツへジャンプ
ASP.NETのTips満載!

チュートリアル

文責:山田奈美最終更新日:2006年12月18日

「Ajax」って何だろう?

キャラクターイラスト

近頃よく見聞きする「Ajax」って何だろう?

ASP.NETでも使えるんだろうか?

そんな疑問にお答えするため、ここではAjaxの概要とASP.NETとの関係について解説するよ。

Ajaxって何だろう

  1. 「Ajax」大量発生?
  2. みなさん「Ajax」って、単語を見たり聞いたりしたことはありますか?かなりの確率で「YES」という声が聞こえてきそうです。最近、本屋のPC雑誌/書籍売り場を覗くと、この単語によく出会います。私は先日、契約しているプロバイダのWebメール上にも発見しました。

    そして、各出版社から弊社に執筆依頼されるネタにも「Ajax」が多いのが実情です。どうもかなりの人気者のようです。

  3. 「Ajax」の誕生
  4. そもそも「Ajax」ってどう発音するのでしょう?答えは「エイジャックス」です。名付け親は、Jesse James Garrettさんです。彼が2005年2月に書いたコラム「Ajax: A New Approach to Web Applications」で初めて世に出てきました。このコラムを日本語訳したページも存在するようです。(「Ajax: Web アプリケーション開発の新しいアプローチ」)

  5. 「Ajax」の特徴
  6. さて、前置きが長くなりましたが、そろそろ「Ajax」の中身を見ていくことにしましょう。まず、ぐだぐだ説明するよりも百聞は一見に如かず。Ajax技術を利用していることで有名な「Google Maps」を見てみましょう。

    検索したい場所をテキストボックスに入力して、[地図を検索]ボタンをクリックすると、指定場所を中心とした地図が表示されます。ドラッグ&ドロップによって地図を自由自在に移動させることができます。また、ナビゲーションバーを操作することによって地図の移動やズームを調整することができます。以下の図では、私の実家が地図内に収まるように、かつ、周りの町がわかるように少し右へ移動させ、ズームアップしてみました。

    Google Maps
    Google Maps

    このように「Ajax」では、Flash技術のような見栄えのする使いやすいユーザインターフェイス効果を発揮することが出来ます。

ASP.NETでAjaxを使うには?

ここまで見たきたように、Ajaxはとても魅力的な技術です。ぜひ、ASP.NETでのプログラミングにも組み込みたいところです。そこで、ご紹介したいのが、「ASP.NET AJAX」です。先日(2006年10月20日)ASP.NET AJAX(コード名は"Atlas")のVer1.0 β1版がリリースとなりました。

ASP.NET AJAXは、無償で提供されているAjax対応ライブラリ(フレームワーク)です。Ajaxプログラミングを効率化するために、たくさんの機能が詰まっています。

現在、以下のとおり5つのパッケージが提供されています。詳しいインストール方法や使い方については、今後公開予定の記事を参照してください。

ASP.NET AJAXのパッケージ
パッケージ名概要
Microsoft ASP.NET AJAX v1.0 BetaASP.NET AJAX Ver1.0の完全パッケージ
Microsoft ASP.NET AJAX CTP BetaASP.NET AJAX Ver1.0には入っていない開発中の機能(将来コアモジュールに入る予定)
ASP.NET AJAX Control ToolkitASP.NET AJAXを基にしたサーバコントロール群
Sample ApplicationsASP.NET AJAXを基にしたサンプルアプリケーション
Microsoft AJAX Library BetaASP.NET AJAXのクライアントフレームワーク部分(ASP.NET以外の環境での利用向け)

ASP.NET+AjaxにASP.NET AJAXは必須?

いいえ。ASP.NET+Ajaxプログラミングに必ずしもASP.NET AJAXは必要ではありません。Ajaxは、JavaScriptやDynamic HTML、XMLなど昔からある、皆さんが使ったことがある(かもしれない)技術だけで実現できます。

Google Mapsを例に「Ajax」技術のしくみを説明すると、まず、Ajaxでは最初に必要なデータ(地図)だけをダウンロードします。その後ユーザの操作によって必要になったデータを「非同期に」サーバから取ってきて、ダイナミックHTMLを使って動的に画面に表示させます。

「非同期」とは、サーバとクライアントとが別々に処理することです。一般的なWebサイトでは、クライアントが要求してからサーバが応答するまでの間、クライアントは応答を待つことしかできません。その間に操作をしても、再び要求を出さないと反映されません。でも、「非同期」の場合は、サーバが必要なデータを取ってきている間に、クライアントが地図を移動したり、倍率を変更したりすることが可能となります。

もうちょっと詳しく説明すると、Ajaxでは、ページ上で発生したイベントをJavaScriptでとらえて、XMLHttpRequestオブジェクト(JavaScriptでHTTP通信を行うオブジェクト)で情報をサーバ側に非同期に送信します。そして、応答を受け取り、ダイナミックHTMLを使って、ページ上の必要な箇所だけを書き換えます。

つまり、ASP.NET AJAXは必須と言うわけではなく、既存の技術のみでもASP.NET+Ajaxプログラミングは可能です。ASP.NET AJAXを使うと、効率よくラクに簡単にプログラミングが可能になるというわけです。

興味のある方は、以下の参考書籍/サイトも見てみてください。

コンテンツの終わりです。