AJAX とか ASP.NET AJAX って何？

ここではそもそも AJAX って何？というところから簡単に説明します。が、詳しい説明は、他所のサイトでたくさんあると思いますから、なるべく大胆に簡単に書こうと思います :-)

AJAX って何？

さて、まず AJAX は「エイジャックス」と読みます。AJAX が出てきた頃には、どう読むかわからず「あじゃっくす」などと読む人もいたようですが、今は（少なくとも英語圏では）「エイジャックス」という呼び方で決まってます。アメリカ人やインド人などの海外の人と話すときにも、「エイジャックス」と言っておけば間違いないです。

AJAX というのは、Asynchronous JAvaScript + XML の頭文字をとったものです。

Asynchronous =「非同期」とは？それがどういう風に Web に組み込まれるの？

Asynchronous は「非同期」のことです。これは AJAX 専用の用語ではないので、ご存知の方も多いと思います。「ある処理を非同期で行う」ということを簡単に言えば「ある処理をし始めたら、それの完了を待ちませんよ。終わったら教えてネ」ということになります。

例えば、ブラウザで何か大きなファイルをダウンロードする場合は、普通、次のような流れになりますよね。

ダウンロードのリンクをクリック
↓
ダウンロード開始
↓
ダウンロードをしている間は、別のサイトを見たり、他のことができる。
↓
ダウンロードが完了したら、「ダウンロード終了！」というメッセージを受け取る

ブラウザによっては違うかもしれませんが、Firefox、 Chrome や IE などのメジャーなブラウザでは基本的にこういう流れになります。

こういう風に、ダウンロードという処理を開始して、それの完了を待たないで別のことをしていて、ダウンロードが完了したらその通知をもらう、というような流れのとき、「ダウンロードを非同期で行った」という風にいいます。

逆に、「非同期処理」ではなく、「同期処理」でダウンロードを行ったとすると・・・

ダウンロードのリンクをクリック
↓
ダウンロード開始
↓
そのページにとどまり、ダウンロードが完了するのをじっと待つ。
（この間、何もできない・・・）
↓
ダウンロードが完了

という流れになって、かなり使いにくいブラウザになってしまいます。

ダウンロードみたいに、時間のかかる処理はぜひとも非同期でやりたいものです。

AJAX の目的はまさにそういうところにあります。

Web ページ内のリンクをクリックして別のページにジャンプすると、通常次のページの情報を取得するために少なくとも数秒かかってしまいます。重い画像のあるページなら数十秒かかるかもしれません。

ページの読み込み時間にユーザーをじっと待たせるのではなく、ページの一部分に「データの取得中です...」などと表示しておきつつ、ユーザーにページのほかの部分を見せておき、データの取得が完了したら、ページ内の必要な部分だけ情報を更新する、という処理ができたほうが、じっと処理の完了を待つより良いはずです。

このような処理を実現するために、AJAX が使われます。

つまり、上のような流れ図を描くと・・・

ボタンやリンクのクリックなどで、時間のかかる処理を開始
↓
処理開始（しばしばこのとき「ロード中...」とか「データ取得中...」などのメッセージが表示される）
↓
ページ全体の遷移は発生せずにそのページにとどまりつつ・・・
↓
処理が終了したら、通知を受けるとか、画面の一部分が書き換えられるなどする。

というような流れになります。AJAX を使うと、こうした流れを実装できます。

AJAX の技術的な基礎

さて、それでは具体的に、どうしたら AJAX を実現できるでしょうか。

ページを切り替えずに、裏側でデータを取りにいく処理は XMLHttpRequest というコンポーネントを使って行います。最初に IE で実装されて、次に Firefox で実装されました。

このコンポーネントを使うと、JavaScript からサーバーに対して HTTP リクエストを投げることができて、その応答を受け取ることができます。サーバーからの応答を全て受信したら、そのタイミングで、表側の画面を書き換えます。そうすれば、そのページを見ているユーザーは、同じページにとどまりつつ、必要な情報をサーバーに問い合わせ、その結果を見ることができるわけです。

典型的な AJAX の流れは、次のようになります。

ユーザーがリンク、ボタンをクリックする。
↓
イベントハンドラで、「ロード中...」とか「データ取得中...」などのメッセージを表示する
↓
続けて、XMLHttpRequest を使ってサーバーに問い合わせ、その応答を待つ
↓
サーバーからの応答を受取ったら、その応答に応じて、画面を切り替える。
(「ロード中...」とか「データ取得中...」などのメッセージも消す)

ちなみに、サーバーからの応答はしばしば JSON (ジェイソン) という形式を用います。

もともとはサーバーからの応答が XML 形式とする場合が多かったこともあって、コンポーネント自体が XMLHttpRequest という名前がついていましたが、必ずしもデータの形式が XML である必要はありません。ポイントは「非同期でサーバーからの HTTP 応答を受取る」というところだけです。そのデータ形式は JSON だろうと XML だろうとかまいません。（が、先にも書いたとおり JSON が主流です）

と、いうわけで、長々と書きましたが AJAX が、だいたいどんなものかイメージがわいたでしょうか。

ASP.NET AJAX とは？

上で説明したように、Ajax を実現するコードは、何らかのイベントハンドラで XMLHttpRequest を用いて、サーバーに対して HTTP リクエストを投げる。その間、「ロード中...」とかのメッセージを出しておいて、サーバーからの応答を読込んだところで、画面を書き換え、という流れになります。

この流れがだいたい決まりきっているので、ブラウザ間の相違点を吸収することも含めて、処理のラッパーとなるさまざまなライブラリが開発されています。

ASP.NET AJAX というのは、その名の通り ASP.NET で AJAX を使うための技術です。

ScriptManager や UpdatePanel などから構成されていて、これを使うと、jQuery などの追加のライブラリを使うことなく、 AJAX を実装できます。

というか、実は裏で XMLHttpRequest が使われている、ということすら意識しなくても "AJAX らしい"、「ページの部分的な更新」などが実現できます。

詳細については、他のページで説明します。