Googleの検索サービスを利用するには以下のURLから申し込みを行います。
http://code.google.com/apis/ajaxsearch/
このページの上にある「Sign up for a Google AJAX Search API key」のリンクをクリックします。次のページが表示されるので「I have read and agree with the terms and conditions」の左側にあるチェックボックスにチェックを入れてからサービスを利用したいURLを入力します。URLを入力したらGenerate API Keyボタンをクリックします。無事にキーが生成されると、キーとサンプルコードが表示されます。サンプルコードはWeb検索だけでなく、ビデオ検索やブログ検索なども含まれたものになっています（サンプルを
実行する）。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>My Google AJAX Search API Application</title>
<link href="http://www.google.com/uds/css/gsearch.css" type="text/css" rel="stylesheet"/>
<script src="http://www.google.com/uds/api?file=uds.js&v=0.1&key=ABQIAAAAasAJryKxWJnBFVJa487d9hTHGAxTVT7IRADYa-JdYz7xQ8IQZBSthgDZdggYpQHsmm6WYtHstQFfLA" type="text/javascript"></script>
<script language="Javascript" type="text/javascript">
//<![CDATA[
function OnLoad() {
// Create a search control
var searchControl = new GSearchControl();
// Add in a full set of searchers
var localSearch = new GlocalSearch();
searchControl.addSearcher(localSearch);
searchControl.addSearcher(new GwebSearch());
searchControl.addSearcher(new GvideoSearch());
searchControl.addSearcher(new GblogSearch());
// Set the Local Search center point
localSearch.setCenterPoint("New York, NY");
// Tell the searcher to draw itself and tell it where to attach
searchControl.draw(document.getElementById("searchcontrol"));
// Execute an inital search
searchControl.execute("Google");
}
//]]>
</script>
</head>
<body onload="OnLoad()">
<div id="searchcontrol"/>
</body>
</html>
サンプルではGoogleという文字を自動的に検索しページ上に表示してしまいます。さすがに、これでは困るので最も単純なWeb検索のみ行えるようにしてみましょう。普通に検索フィールドが表示され、検索したいキーワードを入力しボタンがクリックされたら結果が表示される、というシンプルなものです。
上記のコードの中でWeb検索に関する部分だけ抜き出して作成してみたものが以下のサンプルです。（サンプルを
実行する）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>My Google AJAX Search API Application</title>
<link href="http://www.google.com/uds/css/gsearch.css" type="text/css" rel="stylesheet"/>
<script src="http://www.google.com/uds/api?file=uds.js&v=0.1&key=ABQIAAAAasAJryKxWJnBFVJa487d9hTHGAxTVT7IRADYa-JdYz7xQ8IQZBSthgDZdggYpQHsmm6WYtHstQFfLA" type="text/javascript"></script>
<script language="Javascript" type="text/javascript">
//<![CDATA[
function OnLoad() {
var searchControl = new GSearchControl();
searchControl.addSearcher(new GwebSearch());
searchControl.draw(document.getElementById("searchcontrol"));
}
//]]>
</script>
</head>
<body onload="OnLoad()">
<div id="searchcontrol"/>
</body>
</html>
Web検索を行うだけであれば三行です。検索用のコントロールを作成し、検索対象を設定します。あとは、検索フィールドを描画して終了です。これだけで（サンプルなので、制限付きですが）一応検索を行うことができます。
[
目次へ]
(2006.6.6)