連載
ASP.NET AJAXを理解する

第1回 ASP.NETはどのように“Ajax”と融合したのか?

マイクロソフト 松崎 剛
2007/03/06
Page1 Page2

1. ASP.NETの真価とAjaxの融合

 2007年1月末にリリースされたASP.NET AJAX 1.0は、以前から“Atlas”と呼ばれるコードネームで、世界中の開発者たちからの多くのフィードバックを参考にしながら開発が進められてきた。ここでは、このASP.NET AJAXという技術がほかのAjaxの技術とどう違うのかといった点に注目しながら、その本質をとらえていく。読者がASP.NET AJAXという技術をどのように活用していくかの参考にしていただきたい。

 今回は、その具体的な中身を1つずつ見ていく前に、まずは、ASP.NETがそもそもどのような趣旨に基づいた技術であるかを説明し、そのASP.NETの思想に対してASP.NET AJAXがどのような融合を目指しているかという点について解説する。その後、ASP.NET AJAXの全体の構成を見ていく。

 なお、本連載はASP.NET AJAXのインストール方法や具体的なアプリケーションの実装手順については説明しない。これらについて知りたい方は、「ASP.NET AJAX ファーストルック」を参照してほしい。

1-1. ASP.NETが開発環境にもたらしたもの

 では、Web開発テクノロジの歴史の中で、ASP.NETテクノロジがどのような価値をもたらしたのか、いまここで振り返って整理してみよう。

 そもそもASP.NET以前から、Windows OSにはIIS(Internet Information Services)を利用した“ASP(Active Server Pages)”と呼ばれるサーバサイド・スクリプト実行環境が備わっており、VBScriptなどで記述したスクリプト・ファイルによりWebアプリケーションを構築できた。つまり従来からダイナミックなWebサイトの構築ができたわけである。

 それでは、当時のASPと現在のASP.NETの違いは何なのか。もちろん、.NET Framework上で動作するかどうかや、C#やVisual Basicなどの.NET言語で記述できるかどうかといった点を挙げることもできるだろう。しかしこの2者の間には、これ以上にもっと重要な相違が存在している。

 例えば、次のような動作をするWebアプリケーションの開発をイメージしてほしい。

(1)ページ上にテキストを表示するラベルとボタンが配置されている
(2)ボタンを押すと、カレンダーが現れる
(3)カレンダーから日付を選択すると、ラベル上に日付が表示される

 このアプリケーションを従来のASP、もしくはさらに以前のCGI(Common Gateway Interface)などで実現するためには、数多くの開発ステップや仕組みが必要となるだろう。

 まず、ボタンを押してカレンダーを表示するために、カレンダーを表示するページを作成し、さらにその画面に遷移するための仕組みを構築する必要がある。具体的には、別のページに遷移するようにしたり、効率の良い仕組みにするには元のページ(=自分自身)に再度遷移し、POSTしたパラメータによってカレンダーの表示/非表示を制御したりする。また、カレンダーの表示では、<TABLE>タグや<IMG>タグを駆使して作成することになるだろう。そして、カレンダーの値が選択され、カレンダーを表示するページに遷移した後も、その日付内容を保持しておくためには、「HIDDENタグ*1」といったHTMLの仕組みを使うなどの必要があった。

*1 <input type="hidden" name="……" value="……">のタグを利用してページ間でデータを引き継ぐ方法。

 要は、こうした一連の仕組みを作成するためには、「HTML上ではどのような技術を利用することができ」、かつ「それがどのように動作し」、「ブラウザとWebサーバ間でどのような値の受け渡しを行うか」などといった知識を有したうえで、画面遷移などを設計する必要があったのだ。筆者もそうであるが、この時代にWeb開発をされていた方は、先に述べたHIDDENタグや、セッション、さらにはクッキーなどのユーザーから見えない仕組みを多用しながら、これらと戦って開発を行っていたのではなかろうか。

 では、これがASP.NETになると、どのような開発スタイルになるのだろうか。

 ASP.NETの開発を経験された方はすでにご承知のことと思うが、同じものをASP.NETで作る場合には、(Visual Studioを使って)Webフォーム上に、ラベル、ボタン、カレンダーなどの「標準コントロール」を貼り付け、そのフォームをダブルクリックしてページのLoadイベント処理にカレンダーのVisible属性をfalse(非表示)にするコードを記述し、同じくボタンのClickイベント処理にカレンダーのVisible属性をtrue(表示)にするコードを記述する。さらに、カレンダーの日付選択時のイベント処理で、選択された日付の内容をラベルに設定するコードを記述する。これで終了である(下記コードを参照)。

// ページのLoadイベント処理
protected void Page_Load(object sender, EventArgs e)
{
  Calendar1.Visible = false; // カレンダーを非表示
}

// ボタンのClickイベント処理
protected void Button1_Click(object sender, EventArgs e)
{
  Calendar1.Visible = true; // カレンダーを表示
}

// カレンダーの日付選択時のイベント処理
protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
  Calendar myObj = (Calendar) sender;
  Label1.Text = myObj.SelectedDate.ToString(); // 選択されている日付をラベルに表示
}
カレンダーの表示と選択された日付をラベルに表示するコード(ASP.NET)

 この開発スタイルは、単に記述するコードが少なくなったという意味以上に、開発者が本来書くべきビジネス・ロジックのみに専念して開発ができるという点が重要である。実際にこうして作成されたASP.NETのアプリケーションを動作させてみると分かるが、ボタンを押した際や日付を選んだ際など、サーバへのポストバック処理(自分自身のページへの遷移)が発生する。またボタンやカレンダーを操作してページを遷移している最中でも、ラベルの値は保持されている。では、ASPのころの煩わしい画面遷移やHIDDENタグを使った処理などは誰が書いているのだろうか。それは、ASP.NETのフレームワークが作成してくれているのである。

 ASP.NETでは、開発者が作成したビジネス・ロジックのコードはもちろんのこと、ASP.NET Webフォーム(.aspxファイル)上に記述したマークアップ言語のコードも含め、すべてその中身が解析され、C#やVisual Basicなど開発者の皆さんが普段.NETの開発で記述しているようなクラスやロジックの形に展開されてコンパイルされている。そして、この解析と展開の作業が重要な役割を担っている。解析され展開されたクラスはASP.NETのサーバサイドのクラス群と協調して働き、さまざまな面倒な処理を陰で実行してくれる。例えばクライアントサイドでボタンが押された際に、サーバへポストバックする処理の埋め込み(ブラウザに送信するページへのタグの埋め込み)や、それを受けて動作するサーバサイドの応答処理などを行ってくれるのである。

 実は上記で登場した「標準コントロール」はある種「論理的」な存在で、サーバサイドのクラス群によりHTMLコードとして展開される。例えば、カレンダー・コントロールはASP.NETの世界だけに存在する概念で、それに1対1で対応する実際のHTMLタグは存在しない。実質的にはASP.NETのフレームワークが、HTMLコード上でカレンダーに見えるように、<TABLE>タグなどを駆使したHTMLコードに展開してくれているのである。

 

 INDEX
  [連載]ASP.NET AJAXを理解する
  第1回 ASP.NETはどのように“Ajax”と融合したのか?
  1.ASP.NETの真価とAjaxの融合
    2.ASP.NET AJAXの基本動作
 
インデックス・ページヘ  「ASP.NET AJAXを理解する」


Insider.NET フォーラム 新着記事
  • 第2回 簡潔なコーディングのために (2017/7/26)
     ラムダ式で記述できるメンバの増加、throw式、out変数、タプルなど、C# 7には以前よりもコードを簡潔に記述できるような機能が導入されている
  • 第1回 Visual Studio Codeデバッグの基礎知識 (2017/7/21)
     Node.jsプログラムをデバッグしながら、Visual Studio Codeに統合されているデバッグ機能の基本の「キ」をマスターしよう
  • 第1回 明瞭なコーディングのために (2017/7/19)
     C# 7で追加された新機能の中から、「数値リテラル構文の改善」と「ローカル関数」を紹介する。これらは分かりやすいコードを記述するのに使える
  • Presentation Translator (2017/7/18)
     Presentation TranslatorはPowerPoint用のアドイン。プレゼンテーション時の字幕の付加や、多言語での質疑応答、スライドの翻訳を行える
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

Insider.NET 記事ランキング

本日 月間