back

データストアとオブジェクト検索 (4/7)

■Ajaxでアクセスするためのライブラリの用意

では、サーブレットにアクセスして、LinkDataを取り出し表示するWebページを作成しましょう。ここでは、index.htmlをそのまま利用することにします。ここから、Ajaxを使ってサーブレットにアクセスし、データを受け取って処理することにしましょう。

が、いちいちAjax関係の処理をWebページに書いていくのは大変なので、その前に必要な機能をライブラリとして作成しておくことにします。下のリストがその内容です。「lib.js」というファイル名でこれを保存し、プロジェクトの「war」ディレクトリ内に配置しておきましょう。

ここでは、以下のような関数を用意しておきました。


createHttpRequest
Ajaxで利用するXMLHttpRequestオブジェクトを作成し返す関数です。XMLHttpRequestは、ブラウザの種類やバージョンによって生成法が異なります（IEさえなければすべて１つの方法だけで可能なんですが）。ですので、IEなんてものがこの世に存在するおかげで、我々はしちめんどくさいことをしなけりゃならないわけです。

getData
これは、Ajaxを使ってサーブレットにアクセスするものです。引数にID番号が渡せるようにしています。実行後、「callback」という関数を呼び出すようにしてありますので、それぞれのWebページでこのcallback関数だけ定義しておけば、取得後の処理を行えるというわけです。

getQuery
これは、クエリー文字列を解析し、連想配列にして返す関数です。Webでは、URLの末尾にパラメータ情報を追記して送信しますので、こうしたパラメータ情報（クエリー文字列）を扱い易い連想配列に直すための関数を用意しておきました。といっても、ここではエンコードの処理などはまったくしてません。


(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

function createHttpRequest(){
	var httplist = [
		function(){ return new XMLHttpRequest(); },
		function(){ return new ActiveXObject("Msxml2.XMLHTTP"); },
		function(){ return new ActiveXObject("Microsoft.XMLHTTP"); }
	];
	for(var i = 0;i < httplist.length;i++){
		try {
			var http = httplist[i]();
			if (http != null){ return http; }
		} catch(e){ continue; }
	}
	return null;
}

function getData(id){
	var request = createHttpRequest();
	if (request == null){
		alert("HttpRequestが取得できませんでした。");
		return;
	}
	var uri = "/mygae";
	if (id != null) uri = "/mygae?id=" + id;
	request.open("GET",uri,true);
	request.setRequestHeader("User-Agent","XMLHttpRequest");
	request.onreadystatechange = function(){
		if (request.readyState == 4 && request.status == 200){
			callback(request);
		}
	}
	request.send();
}

function getQuery(){
	var datas = new Array();
	var query = location.search.substring(1);
	var arr = query.split('&');
	for(var i = 0;i < arr.length;i++){
		var item = arr[i].split('=');
		datas[item[0]] = item[1];
	}
	return datas;
}



　 　

記事のリストに戻る



PC Site G+ mail
copyright 2009. SYODA-tuyano.