【Ajax】Sync(同期)とAsync(非同期)の体感テスト
AjaxのXMLHttpRequest オブジェクトでは、openメソッドの第3引数にturuかfalseを指定して、
Async(非同期通信)かSync(同期通信)かを選ぶことが出来ます。
そこで、Async(非同期通信)とSync(同期通信)はどう違うのか？
を体感できるアトラクション、もといページを作ってみました。
Sync(同期)とAsync(非同期)の体感テスト
http://jsgt.org/ajax/ref/test/async/test1.htm
http://jsgt.org/ajax/ref/test/async/test1_1.htm(2005.4.30修正版)
* 連続でリクエストするとresponseTextが1回しか返ってこないので調べたら変数resをローカルにしてなかったのが原因ぽい、、、ということで修正版→test1_1.htm、何度クリックしてもおおむね^^?返ってきます(確か、レスポンスが戻ってくる順番はHTTPの仕様で保証されていたはず、、、(*1)。)
(*1) レスポンスの順番を保証している部分は、 た ぶ ん 、、、 RFC2616の8.1.2.2 パイプライン化かな〜、、、?? と思っているんですけれど、教えて＞詳しい方。
8.1.2.2 パイプライン化
永続的な接続をサポートするクライアントはそのリクエストを (それぞれのレスポンスを待つことなしに複数のリクエストを送る) "パイプライン" する事ができる。サーバはリクエストが受信されたのと同じ順番でそれらのリクエストのレスポンスを返さなければならない。 『RFC2616』
【ソース】
サーバー側
test1.php
<?php
//2秒寝ます、、、ぐ〜ぐ〜
sleep(2);
//じゃ、レスしますね。
echo "testText:" ;
?>
js側
test1_1.htm
<!-- 暫定Ajaxライブラリ -->
<script language = "JavaScript"
charset = "Shift_JIS"
src = "./
jslb_ajax.js"></script>
<script language="JavaScript">
<!--
//ファイルを読み、responseTextの値を処理の順番に確認します
function getTxtFile(fileName,async)
{
//XMLHttpRequestオブジェクト生成(2005.4.30修正)
//
res = createHttpRequest()
var res = createHttpRequest()
//open メソッド
res.open("POST", fileName , async )
res.onreadystatechange = function()
{
if (res.readyState==4)
{
oj = document.getElementById('output')
oj.innerHTML += res.responseText
}
}
//send メソッド
res.send('')
}
//-->
</script>
<b>【Async(非同期)】</b>
<br>
<input type = "button"
value = "'test1.php,false 同期"
onclick = "getTxtFile('./test1.php',false)">
<br><br>
<b>【Sync(同期)】</b>
<br>
<input type = "button"
value = "'test1.php,true 非同期"
onclick = "getTxtFile('./test1.php',true)">
</form>
<b>【サーバーからの返信】</b>
<div id="output"></div>
追記
2005.4.30.pm22:59
ちょっとまった、、、Firefox(Win,Mac)でSyncだけ返事がないやん、、、。仕様的にはSyncでonreadystatechange使う必要はないぽく読めるのでそこらあたりか？？要調査。と、思って今やってみたけど関係ない、、、バグぽい。。。？と、思ったら、もうひとつMozの微妙な反応を発見、 Asyncの方でも、readyState:3でresponseTextが帰ってきてます（IEの仕様では、「3だとresponseTextプロパティはエラーを返すでしょう」なんですが、解釈の問題ってところです。）ようするに、readyState チェックだけでは駄目ってことですね。、、、うー、やることが増えていく、、、。
JavaScript++かも日記
【最近の記事】
かも日記
![[Valid RSS]](http://jsgt.org/mt/archives/01/valid-rss.png "Validate my RSS feed"){kind=small}
ページ全体の読み込み完了まで少々お待ちください...
