ぶろぐ

日記です

チラシ裏、unloadイベント時にxmlhttprequestを呼ぶときは同期通信で

日記

JavaScriptって、基本ぜーんぶ（ほとんど）ノンブロッキング関数。


ステートレスなHTTP、Response返したら俺たちの関係終わりだよねー
っての基本だけど、時代は色々あってステートフルなものが要求されたりする。


「ユーザーがそのページを離れた」という情報をサーバーが知りたい事がある。
頭足りない自分が考えた実現方法は…

  • Ajaxリクエストでポーリングしまくって、リクエストがなくなったらページを離れた
    • httpサーバーにpostメソッドでリソースに更新をかけ続ける、更新が一定期間無かった場合、クライアントはページを離れたと判断する。
    • httpサーバーはrequestがあったら、応答して終わり。
    • なので、「そういえばクライアントからrequestとんでこないなー」というのは感知できないので、別途タイムスタンプを監視するサーバーが必要（だと思う）
    • んーなんか無駄過ぎる
  • Websocketを使って、セッションを張り続ける
    • セッション切れたら、ページを離れた
  • Cometとか使ってみる
    • よくわからないけど、セッションが切れた事を多分感知できると思う

大変だーーーーーorz

こんな方法しか思いつかなかった…。
なんかいやだけど、クライアントがページを離れた事を、自分でサーバーに教えよう。
通信が切断された、PCの電源がいきなり切れた
などの場合は、感知できないorz


JavaScriptで、ページを離れるときに呼びだされるunloadイベント。
このイベントが呼ばれた時に、サーバーにxmlhttprequestで「ページはなれます」というデータをpostする。
なんかいやだけど、簡単なのはこれかな？


その際に、xmlhttprequestがノンブロッキングである事で、少し躓いた。


非同期でサーバーにリクエストすると、ページを離れる処理が先に行われ、サーバーと通信が完了する前に処理が終了してしまう。
（なんか、Chromeはサーバー通信する前にすぐ終わって、IEだと通信してページを離れた）


非同期モードを、同期モードにすると行けた。
サーバーとの通信が終わってから、ページを離れた。


生javascriptのコード載せるのは面倒なので、jqueryの例でいくと…

window.unload = function() {
  $.ajaxSetup({async: false});
  $.ajax(ごにょごにょ〜）;
}

とか

$(window).unload(function(){
	$.ajax({
		async: false,
		cache: false,
		type: "POST",
		url: "./hogehoge",
		data: {"outi":"kaeru"},
		dataType:"json",
		success: function(data){
			alert(data);
		}
	});
});

とか、（動くかな？）

async:false

にするのがきも。デフォはtrue
きっといつか読み返す！