AJAX
はじめに
Asynchronous JavaScript and XML (AJAX) はそれ自体がある種の技術というわけではありませんが、 Jesse James Garrett によって 2005 年に作られた言葉で、既存の技術同士を組み合わせた新しいアプローチを意味します。組み合わされる技術は、HTML, XHTML, CSS, JavaScript, DOM, XML, XSLT, そして最も重要なものは XMLHttpRequest
オブジェクトです。
これらの技術が AJAX のモデルで組み合わされると、ウェブアプリケーションはより早く、表示されているページ全てを再読み込みすることなく、ユーザーインターフェイスを逐次更新できるようになります。そして、アプリケーションにより早い表示、より良い応答性をもたらします。
Ajax の X は XML を表していますが、 JSON の方がより軽く JavaScript の一部であることなど数多くの利点があるため、今日では XML よりもよく使われています。 JSON と XML はどちらも Ajax モデルの情報をパッケージ化するために使用されます。
ドキュメント
- はじめに
-
この記事では AJAX の基本について説明し、始めるために 2 つの簡単な実例を紹介します。
XMLHttpRequest
API の使用-
XMLHttpRequest
API は、Ajax のコアです。この記事では、次のような Ajax 技術の使用方法について説明します。- サーバーのレスポンスの分析と操作
- リクエストの進捗のモニタリング
- フォームの送信とバイナリーファイルのアップロード – 純粋な Ajax、もしくは
FormData
オブジェクトを使用します - ウェブワーカー内部における Ajax の使用
- Fetch API
-
Fetch API はリソースをフェッチするためのインターフェイスを提供します。
XMLHTTPRequest
を使用した人なら誰にでも馴染みのあるように見えますが、この API はより強力で柔軟な機能セットを提供します。 - Server-sent イベント
-
伝統的に、ウェブページは新しいデータを受信するためにサーバーにリクエストを送信しなければなりません。つまり、ページはサーバーにデータを要求します。サーバーが送信したイベントでは、サーバーがメッセージをウェブページにプッシュすることで、いつでもウェブページに新しいデータを送信することができます。これらの着信メッセージは、ウェブページ内の*イベント+データ*として扱うことができます。サーバー送信イベントの使用を参照してください。
- 純粋な Ajax ナビゲーションサンプル
-
この記事では、純粋な Ajax ウェブサイトの 3 つのページから構成された実用的な (最小限の) 例を提供します。
- バイナリーデータの送信と受信
-
XMLHttpRequest
オブジェクトのresponseType
プロパティを設定して、予想されるレスポンスタイプをサーバーから変更することができます。可能な値は空文字列 (デフォルト),arraybuffer
,blob
,document
,json
,text
です。response
のプロパティには、responseType
に従ってArrayBuffer
,Blob
,Document
,JSON
、または string のようなエンティティ本文が含まれます。この記事では、Ajax の I/O 技術をいくつか紹介します。 - XML
-
Extensible Markup Language (XML) は、特定の目的のマークアップ言語を作成する W3C 推奨の汎用マークアップ言語です。これは SGML の単純化されたサブセットであり、多くの異なる種類のデータを記述することができます。その主な目的は、異なるシステム、特にインターネットを介して接続されたシステム間でのデータの共有を容易にすることです。
- XML の解釈とシリアライズ
-
文字列、ファイル、または JavaScript を使用して XML 文書を解釈する方法、XML 文書を文字列、Javascript Object Tree (JXON) またはファイルにシリアル化する方法
- XPath
-
XPath は XML Path Language (XML パス言語) の略で、XML 文書のさまざまな部分をアドレス指定する (指す) 柔軟な方法を提供する非 XML 構文を使用します。これと同様に、ドキュメント内のアドレス指定されたノードをテストしてパターンに一致するかどうかを判断することもできます。
FileReader
API-
FileReader
API を使用すると、ウェブアプリケーションがユーザーのコンピューターに格納されているファイル (または生データバッファ) の内容を非同期に読み取ることができ、読み取るファイルまたはデータをFile
またはBlob
オブジェクトで特定します。 File オブジェクトはユーザーが<input>
要素を使用して選択した結果として返されるFileList
オブジェクト、ドラッグ&ドロップ操作のDataTransfer
オブジェクト、HTMLCanvasElement
のmozGetAsFile()
API から取得することができます。 - XMLHttpRequest における HTML
-
W3C の XMLHttpRequest 仕様書では、もともと XML の解析のみに対応していた
XMLHttpRequest
に HTML 解析の対応が追加されています。この機能を使用すると、ウェブアプリケーションはXMLHttpRequest
を使用して解析された DOM として HTML リソースを取得できます。
ツール
関連情報
- Ajax: ウェブアプリケーションへの新しいアプローチ
-
Adaptive Path の Jesse James Garrett は 2005 年 2 月にこの記事を書いて、 Ajax とその関連概念を紹介しました。
- XMLHttpRequest の仕様書
-
WHATWG ライブ標準