触ってみようASP.NET 2.0 AJAX Extensions

Microsoft ASP.NET AJAXの利用方法を学習する

Web Development Helperの利用

　今回は使用しませんでしたが、ASP.NET AJAXの開発を行う上で非常に有効的なツールがあるので紹介します。そのツールはWeb Development Helperと言い、ASP.NET開発チームのリーダーであるNikhil Kothariさんが作成されたロギングツールです。ASP.NETの開発を進める上で、HTTP通信のやり取りや、データの送受信がどのように行われているか知っておくことで、アプリケーションの改良やバグなどに気づきやすくなります。

　Web Development Helperの魅力的な機能は次のようになっています。

• AJAX技術の1つであるXMLHTTPRequestのロギング
• UpdatePanelコントロールなどの部分更新が行われた際の通信の中身の確認
• JSONオブジェクトのグラフをビューアに表示
• ログを受け取った際にImageファイルも表示
• 現在のView Stateの確認
• スクリプトエラー時のエラー情報が見やすい
• HTML DOMを見る
• キャッシュで保存された項目のチェック

　なお、これらの機能はデバッグ時にフル活用できますが、公開されているWebサイトなどを見る時にも一部の機能は利用可能です。ただし、Web Development Helperは、Internet Explorer上でしか扱えないという点に注意してください。

　Web Development HelperのインストーラーはWeb Development HelperのWebページからダウンロードができます。右側にある、BinariesのWebDevHelperをダウンロードしてください（図25）。

図25 Web Development Helper サイト画面

　解凍後、インストーラーを実行することでWeb Development Helperのインストールが完了します。

　インストールの完了後にブラウザを立ち上げて、メニューバーのツールにWeb Development Helperという項目があるので、クリックしてください（図26）。

図26 Internet Explorerの［ツール］から選択

　ブラウザの下部にWeb Development Helperが立ち上がり、利用が可能になります（図27）。

図27 Internet Explorer上に表示されるWeb Development Helper

まとめ

　本稿ではAJAX Extensionsコントロールの解説と同時に簡単なサンプルを用いてWebページを実装してみました。気がついたかと思いますが、今回作成したWebページではAJAXの機能を実現しているにもかかわらず、1行もJavaScriptを記述していません。使っていたのはASP.NET 2.0のコントロールとAJAX Extensionsのコントロールだけです。実際に触れてみると非常に簡単に、そして楽しく実装することができます。今回は基本的な3つのコントロールの紹介しかしていませんが、十分にAJAX Extensionsの魅力が分かってもらえたと思います。ぜひ今回触れていない他のコントロールにも触れて、いろいろなWebサイトを作成してみてください。

参考資料

1. ASP.NET AJAX（公式ページ：英語）
2. ASP.NET AJAX Docs（ドキュメント：英語）
3. Web Development Helper（英語）