Ajax について

パソコン／プログラミング

Ajax通信についてまとめる。私は長らくAS400の世界にいたのでAjaxについては良く分からなかった。

Ajax

  • Asynchronous Javascript+XML の略。
  • 非同期なJavascriptとXML という意味。
  • まったく新しい技術ではなく、既存の技術の組み合わせ。
  • 2005年に命名。

非同期通信

  • 従来のWebアプリケーション では
    • 次ページのレンダリングが終了するまで待つしかない。
    • ユーザーがアクションを起こす度に次のページに飛ばされる。
    • サーバーから応答が返ってきて次頁表示まで待たされることになる。
  • Ajax では
    • ユーザーアクションに対する反応はJavaScriptによってブラウザの中で実行される。
    • サーバーからデータ取得する必要がある場合のみ、バックグラウンドでHTTPサーバーと非同期通信する。
    • ユーザーは通信中もブラウザ操作ができるので通信のために待たされることがない。
    • 通信結果はDHTMLを用いて現在のページに部分的に更新することで反映。
    • Ajaxの良さは、アプリケーションの操作感が改善されること。

要素技術：JavaScript

  • ブラウザに処理系が組み込まれている。
  • サーバーと全くやり取りせずとも動きのあるWebページを作成できる。

要素技術：XML

  • タグを用いてマークアップやデータ表現を表す一種の言語の枠組み。
  • 現在ではデータ表現、設定ファイルなどで用いられるフォーマットに成長している。
  • Ajax の名前にXMLが含まれているのは、Ajaxを使った初期のアプリケーションにXMLを使ったものが多かったから。
  • JavaScript で非同期通信を実現するオブジェクトがXMLHTTPRequest という名前だったため。
  • XMLを用いないXMLHTTPRequestによる通信も存在する。YAML、JSONなど多岐にわたる。

JSONデータの例

{
  "name": "mhaya",
  "skills": ["RPG", "Java", "JavaScript", "SQL" ]
}

Ajax サイトに共通する特徴

  • Webページの遷移がない
  • 非同期な通信による高い反応速度
  • アニメーションやドラッグ＆ドロップなど、HTMLフォームだけでは表現できないユーザーインターフェース。