Server-Sent Eventsドラフト版では、Cometを簡単に記述できるためにEventSourceオブジェクトを定義している
次のように、EventSource()コンストラクタにURLを渡し、返されたオブジェクトのmessageイベントを処理するだけ。
var ticker = new EventSource("stockprices.php");
ticker.onmessage = function(e) {
var type = e.type;
var data = e.data;
//ここで、イベントタイプやイベントデータ文字列を処理する
}
参考書籍：
<script>要素をAjaxトランスポートとして使う方法は、JSONPという名前で呼ばれる
JSONPでは、HTTPリクエストのレスポンスボディをJSONエンコードして送信する
<script>のsrc属性を設定するだけで、指定したURLをダウンロードするためにブラウザがHTTPリクエストを発行する
<script>要素がAjaxトランスポートとして便利なのには、大きな理由が1つある
<script>要素は同一出身ポリシーの制約を受けないので、<script>要素を使って、ほかのサーバからデータを取得できるから
また、JSONエンコードされたデータからなるレスポンスのボディを自動的にデコードしてくれるから
HTTPリクエストのアップロード状況を監視するために使えるイベント
XMLHttpRequestオブジェクトにuploadプロパティが定義されている
uploadプロパティの値はオブジェクト
このオブジェクトには、
addEventListener()イベント
onprogressプロパティ
onloadプロパティ
などのプログレスイベントプロパティ群が定義されている
参考書籍：
readystatechangeイベントよりももっと便利なイベント群が定義されているこのイベントモデルでは、XMLHttpRequestオブジェクトからリクエストの定義ごとに異なるイベントが発生する。この結果、readyStateプロパティを確認する必要がなくなる
loadstartイベント
send()メソッドが呼び出されたとき一度だけ発生する。
progressイベント
サーバーのレスポンスがダウンロードされているとき発生する。 XMLHttpRequestオブジェクトが発生させる 50ミリ秒ごとに発生させる リクエストが非常に早く完了した場合、発生しない場合もある
loadイベント
リクエストが完了したとき発生する loadイベントハンドラで、XMLHttpRequestオブジェクトのstatusコードをチェックする。
HTTPリクエストが完了できない場合は3通り、対応するイベントも3通りある
timeoutイベント abortイベント(18.5.1項) errorイベント
ブラウザは、任意のリクエストに対して、load、abort、timeout、errorイベントのいずれか1つだけを発生する。
以下の例のように、イベントプロパティが存在するかどうかで、ブラウザがプログレスイベントをサポートしているかをテストできる
if("onprogress" in (new XMLHttpRequest())) { //プログレスイベントがサポートされている }
プログレスイベント用のイベントオブジェクトの3つの便利なプロパティ
loadedプロパティ
現在までに転送されたバイト数が格納される
totalプロパティ
「Content-Length」ヘッダから転送するデータの大きさがわかっていれば、 データの大きさが格納される。 もしもわからない場合は0が格納される
lengthComputableプロパティ
コンテンツの大きさがわかっていれば、trueが わかっていなければfalseが格納される。
request.onprogress = function(e) { if(e.lengthComputable) progress.innerHTML = Math.round(100 * e.loaded / e.total) + "% Complete"; }参考書籍：
HTMLフォームにファイルアップロード要素のほかにも要素が含まれるときには、 ブラウザは通常のフォームエンコード方法を使うことができない このような場合は「multipart/form-data」として知られる特殊なコンテントタイプを使って フォームをPOSTしなければならない
参考書籍：
HTMLフォームの<input type="file">要素でユーザがファイルを選択したときに、 POSTリクエストのボディとしてファイルのコンテンツを送信する機能がある。
send()メソッドにFileオブジェクトを引数として渡すことで、ファイルをアップロードできる。 File()オブジェクトコンストラクタはない。 <input type="file">要素には、filesプロパティがある。 Fileオブジェクトの配列のようなオブジェクトが格納されている Fileオブジェクト(22.6、22.7節) ドラッグ＆ドロップAPIでは、ユーザが要素にドロップしたファイルに、 dropイベントのdataTransfer.filesプロパティを使ってアクセスできる。 Fileタイプは、もっと汎用的なBlobタイプの派生型(22.5節、22.6.3項)
参考書籍：
XMLドキュメント
<query>
<find zipcode="02143" radius="1km">
pizza
</find>
</query>
XMLHttpRequestのsend()メソッドの引数に、XML Documentオブジェクトを渡すこともできる。
Content-Typeヘッダを指定せずに、send()メソッドに、 XML Documentオブジェクトを引数に渡すと、自動的に適切なヘッダを設定してくれる。
Content-Typeヘッダを指定せずに、send()メソッドに、 文字列を渡すと、自動的に適切な「text/plain:charset=utf-8」というヘッダを設定してくれる。
参考書籍：
ユーザがフォームを送信するとき、フォーム中のデータ（各フォーム要素の名前と値）は文字列形式にエンコードされ、 リクエストと一緒に送信される。 エンコードされたフォームデータはリクエストボディとして扱われる。
各フォーム要素の名前と値に対してURIエンコードする これを=でつなぎ、&で複数指定する。
find=pizza&zipcode=02134&radius=1km
上記は、以下のようなJavaScriptオブジェクトをフォームエンコードで表現したもの
{
find: "pizza",
zipcode: 02134,
radius: "1km"
}
フォームデータエンコード形式のMIMEタイプ
application/x-www-form-urlencoded
フォームデータをPOSTするとき、Content-Typeには、この値を設定する必要がある。
encodeURIComponent()メソッド
HTMLフォームはデフォルトではPOSTリクエストを使うが、GETリクエストを使うこともできる。 フォーム送信により、読み出し専用の問い合わせを行いたいだけの場合は、GETのほうが適切。 GEETリクエストにはボディがない。 したがってエンコードされたデータ（ペイロード）は、URLの検索部（疑問符の後）としてサーバーに送信する。
参考書籍：