Cat Paw Software

この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。
====== Ajax ======
Webアプリケーションのプレゼンテーション実装テクニックの一つ。Ajaxではサーバサイドの処理結果を表示するとき、別のページへ遷移する代わりに、ページを表示したままバックグラウンドでサーバと通信（非同期通信）し、処理結果のみを取得する。

Ajaxの基本スタイルは、XMLHttpRequestでデータを非同期に取得し、DOMでHTMLを書き換え、CSSで見た目を整形するというもの。非同期通信にはJSONP、iframeも使用される。

Ajaxスタイルのアプリケーションは2002年頃から作成されているが、一般的に広まったのは2005年以降、Ajaxと命名されるとともに爆発的に普及した。今ではWebアプリケーションを作成する上で必須の知識となっている。

AjaxはAnsynchronus JavaScript And XMLの略とされているが、こじつけである((こじつけ命名はよくある話))。AJAXというアメリカではメジャーな洗剤にちなんで命名されたというのが真相。オランダにはAjaxという強豪サッカーチームがあるが、そちらは無関係である。

  * [[http://www.adaptivepath.com/publications/essays/archives/000385.php|Ajax: A New Approach to Web Applications]]
  * [[http://www.openajax.org/index.html|OpenAjax]]

===== 従来のWebアプリとの違い =====
  * 画面遷移の排除。ボタンやリンクを押しても画面が切り替わらないWebアプリケーションが作成可能。
  * サーバ非依存のプレゼンテーション層。画面表示とコントロールをクライアント側に実装できる。プレゼンテーション層とドメイン層はXML等のデータによって仲介される。
  * 非同期処理。ユーザは処理の完了を待つ必要がない。

非同期処理はAjaxの最も重要な要素。非同期処理を上手く導入する事でユーザインターフェースの機能性を大幅に向上する事が可能となる。最近ではAjaxを用いた疑似デスクトップ環境とも言うべきWebアプリも作成されているが、実験レベルで実用には至っていない。

===== 問題点 =====
  * コーディングがかなり面倒。
  * 仕様の相違。ユーザエージェントによってXMLHTTPやjavaScriptの実装が微妙に異なっている。
  * 開発環境の問題。JavaScriptはデバッグがしにくい、開発環境が貧弱、等。
  * 設計の難しさ。データベースのトランザクション管理やセッション管理が重要なエンタープライズWebアプリを非同期処理するのは容易ではない。
  * RESTアーキテクチャとの相性の悪さ。URLクリップやブックマークがし難い。

現在では、これらの欠点は技術レベルの向上、ライブラリ、統合開発環境などによって改善されてきている。

===== Pure Ajax アーキテクチャ =====
Ajaxの登場によって新しいWebアプリケーションの設計が可能となった。従来の設計では、サーバでHTMLを動的に生成しレスポンスとして返しブラウザでHTMLを表示するものである。Ajaxを利用することで、サーバはデータのみを送信し、JavaScriptで静的なHTMLにデータを埋め込んで表示する、という設計が可能となった。これは先に挙げたようなAjaxの問題点のため実装が難しかったが、jQuery等ライブラリの充実やJSONという軽量データフォーマットの発明により現実的なものとなった。 

UIEの中島聡氏はこのようなWebアプリケーションの設計を[[http://satoshi.blogs.com/life/2011/01/pure-ajax.html|ピュアAJAXアーキテクチャ]]と呼び、以下の特徴を持つとしている。

  * サーバー側は、JSON over HTTPのAPIとHTML/CSS（およびそのテンプレート）をスタティックな形でのみ提供する（サーバー側では、ダイナミックなHTMLの生成はしない）
  * クライアント側では、JavaScriptを使ってサーバーから取得したJSONとHTMLのテンプレートを組み合わせて（データ・バインドして）表示する。
  * ウェブサイトはあたかも独立したアプリのように動き、操作中はURLは一切変化しない

ピュアAjaxアーキテクチャでは、アプリケーションサーバはMVCのモデルのみを担当し、HTMLとJavaScriptがコントローラとビューを担当する。これによってモデルをコントローラ、ビューから完全に分離することができる。

===== 基本 =====
  * [[ajax:XMLHttpRequest]]
  * [[ajax:JSONP]]
  * [[ajax:CrossDomain|クロスドメイン制限]]

===== Ajaxの使えるライブラリ =====
  * [[prototypejs|prototype.js]]
  * [[jquery|jQuery]]
  * [[dojo|Dojo]]


===== フレームワークとAjax =====
  * [[rails|Ruby On Rails]]
  * [[java:teeda#teeda_ajax|Teeda Ajax]]

  * [[http://echo.nextapp.com/site/|Echo Web Framework]]
  * [[http://directwebremoting.org/|DWR - Easy Ajax for JAVA]]
  * [[http://struts.sourceforge.net/ajaxtags/index.html|AjaxTags]]
  * [[https://ajax.dev.java.net/|ajax: Project jMaki]]