カーセンサーラボが用意しているAPIを使ってみます。カーセンサーラボが提供しているサービス内容については
カーセンサーラボのページにあるPDFを参照してください。
簡単なところで、カーセンサーラボが提供するメーカー一覧を取得してみます。メーカーのリストを取得するには以下のURLにアクセスします。
http://www.carsensorlab.net/webapi/V1/makerList/
Firefoxなどでアクセスすると、XMLドキュメントツリーで見ることができます。Safariなどでは見ることができないのでSafariの場合には以下のサンプルを実行するとXMLデータを見ることができます。（実際の
サンプルを実行する）
＊非常に反応が悪いことがあります。30秒以上何も表示されないことがありますが、表示されない場合120秒くらいは待ってみてください。
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>カーセンターラボ Ajaxサンプル</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript"><!--
function getMakerList()
{
var reqURL = "http://www.carsensorlab.net/webapi/V1/makerList/";
new Ajax.Request("getXML.rb?"+reqURL, { method: "get", onComplete: displayData });
}
function displayData(httpObj)
{
$("result").innerText = httpObj.responseText;
$("result").textContent = httpObj.responseText;
}
// --></script>
</head>
<body>
<h1>カーセンサーラボ Ajaxサンプル</h1>
<form>
<input type="button" value="メーカー一覧取得" onClick="getMakerList()">
</form>
<div id="result"></div>
</body>
</html>
それではXMLデータからメーカー名を取得してみましょう。makerタグ内にあるnameタグの最初のノードの値がメーカー名になります。makerタグからたどるのが筋ですが、nameタグが入れ子になっていないのでnameタグを直接取得して、そのノード値を読み出します。これだけでメーカー一覧を取得することができます。（実際の
サンプルを実行する）
＊非常に反応が悪いことがあります。30秒以上何も表示されないことがありますが、表示されない場合120秒くらいは待ってみてください。
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>カーセンサーラボ Ajaxサンプル</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript"><!--
function getMakerList()
{
var reqURL = "http://www.carsensorlab.net/webapi/V1/makerList/";
new Ajax.Request("getXML.rb?"+reqURL, { method: "get", onComplete: displayData });
}
function displayData(httpObj)
{
var xmlObj = httpObj.responseXML;
makerName = xmlObj.getElementsByTagName("name");
txt = "";
for (var i=0; i<makerName.length; i++)
{
txt += makerName[i].firstChild.nodeValue + "<br>";
}
$("result").innerHTML = txt;
}
// --></script>
</head>
<body>
<h1>カーセンサーラボ Ajaxサンプル (2)</h1>
<form>
<input type="button" value="メーカー一覧取得" onClick="getMakerList()">
</form>
<div id="result"></div>
</body>
</html>
[
目次へ]
(2006.6.9)