気の向くままに辿るIT/ICT
webzoit.netウェブサイトホームページ
Web技術

ajax / Asynchronous JavaScript + XML

ウェブ造ホーム前へ次へ
サイト内検索
カスタム検索
ajaxとは?

ajax / Asynchronous JavaScript + XML

ajax / Asynchronous JavaScript + XML

 ajaxは『Asynchronous JAvaScript + Xml』の略でHTML(、CSS)、JavaScriptxmlを利用した非同期通信技術の概念です。

Asynchronous / 非同期

 もう少しわかりやすく言うとクライアントの直接操作(ボタンやリンクのクリック)だけではなくJavaScriptがイベントを拾ってサーバとの送受信を非同期で行う技術です。

 サーバとクライアント間の送受信はHTML形式ではなくテキストかxml仕様のDOM(Document Object Model)、または、XMLを搭載せずにDOM仕様を模したようなJSON(JavaScript Object Notation)データを利用することもできます。

 非同期であるということはユーザーインタフェース(UI)上は、リロード(画面更新)を伴わずに双方向のやりとりができるということでもあります。

 この非同期通信にはHTTP通信を行うためのJavaScript組み込みクラスであるXMLHttpRequest(やprototype.jsライブラリのAjax.RequestやAjax.Updaterオブジェクトなど)を利用します。

 非同期である事の大きなメリットはクライアントがサーバの処理を待つ必要がないことと画面遷移や画面更新を伴うことなく見た目の処理が完結する事、これによりFlashのような動きのあるバリエーションに富んだウェブページを双方向性を持って作成する事ができるようになることです。

 またFlashなどとの併用も可能でよりインタラクティブな演出も可能です。

ajax周辺技術

 現行のajax周辺技術ではサーバ側の処理に一部C言語Java、JSP、ASP、PerlPHPをサーバ負荷を加味しながら利用する必要があります。

 また逆に、これらのプログラム言語を利用することでJavaScriptを使わずに実装することもできます。

 これをajaxとは呼べないかもしれませんが、JavaScriptを使ったことがないけど各種プログラミング言語を習得している方にとっては改めてJavaScriptを覚える必要がないというのがメリットとなるかもしれません。

 但し、これまでのウェブ技術同様、実行はブラウザやその設定に依存します。

ajax用API

 2007年後半からYahoo!やGoogleがiGoogleとしてトップページをajax仕様に変更しています。

 更にGoogleやYahoo!では各種APIの公開やajaxで実現できる機能単位の部品(.jsや.css)をライブラリとして提供しています。

 Yahoo!UIのライブラリ(英語)は、ajaxアプリケーションを比較的簡単に作るためのライブラリが用意されています。

 Yahoo!UIは、ダウンロードして各自ウェブサーバに設置する事もhttp://yui.yahooapis.com/を参照して実装する事もできます。

ajax実装の留意点

 非同期通信については数世代前の各種ブラウザではサポートされていない、同じIEでもバージョンによってサポート方法が異なるなどの点があり、JavaScriptはブラウザに依存する事はもちろんユーザーがJavaScriptの使用を許可しない場合には実行できないという点があります。

 対策としては最低でもこれまで同様JavaScriptが利用可能か否かによる分岐処理とブラウザごとの非同期通信を吸収するラッパー(条件によって処理をわける関数等を予め作成、利用する事により条件の違いにより発生する個別対応を都度行う事を回避するもの)を作る作業が必要となるでしょう。

ウェブ造ホーム前へ次へ