Hail2u.net

Yahoo! Search Web ServicesのJSON(P)を利用したサイト内検索

Yahoo! Search Web ServicesJSON(P)を利用すれば、JavaScriptのみでサイト内検索が実現できる上、Ajax的にページ遷移無しで検索が実行できる。Google AJAX Searchが内部で利用しているJSONPらしきアレを利用するケースと違い、こちらは公式にアナウンスされているのでおおっぴらに利用できる。というわけで、ほとんど同じタイトルでほとんど同じネタを連続で書いてみる。

実装は、ひとつ前のエントリでもリンクを張っておいたサンプル・ページで利用しているJavaScriptファイルのような形になる。

Yahoo! Search Web ServicesのWeb Search APIへのリクエストは、

http://api.search.yahoo.com/WebSearchService/V1/webSearch?appid={アプリケーションID}&query={検索語}&site={ドメイン名}&output=json&callback=handleWebSearch

という形で、outputパラメータでjsonを指定するとXMLの代わりにJSONで結果を得ることができ、callbackパラメータでコールバック関数名を指定すると指定したコールバック関数でpaddingしてくれる(JSONPにしてくれる)。あとはコールバック関数でデータを加工してやれば良い。サンプルではprototype.jsや自作ライブラリを使ってたりするが、多重リクエストのことなどは考えなくて良いと思われるので、単純にscript要素を作成して追加するというコードをベタに書いても問題ないと思う。

Yahoo! Search Web Servicesはドキュメントがしっかりしており、速度や安定性も申し分ない。日本語もきちんと扱われているので、「とりあえずJSONP使ってみよう」とか「JSONPってどんなことができるんだろう?」みたいな人の練習台にちょうど良いと思う。del.icio.usは超重かったりするし。

上記サンプルはこのサイトに特化した形になっていてわかりにくいと思うので、既存のライブラリを使わずベタにJavaScriptを書いたサンプルも用意した。100行に満たないコードで実装することができている。script要素を削除してないのはデバッグしやすいようにとか、JSONPで返ってくるデータの構造を良く知らない人のためにとか。こういう類の実際に利用されまくるものではちゃんと削除したほうが良いっぽい。


とりあえずWeblogの各ページにある検索フォームは差し替えてみた。キャッシュの都合で切り替わってないように見える(Powered by Googleとなってたら切り替わってない)時にはスーパー・リロード(Ctrl+F5)で。やはり検索結果がちょっとアレな気がする。どういうのが良いのか具体的にイメージできてないので、挙動的にはこんなもんかなーとかいう感じ。検索結果の表示の工夫よりも、検索語拾ってアサマシ広告を挿入すると良さそうとかそんなことばかり考えてる。

このように検索結果をページ遷移無しで表示することができると、訪問者が検索することイコール訪問者がページに留まることになる。サイト内に訪問者が留まる時間で考えるのなら、ページ遷移ありのごく普通なサイト内検索スクリプトでも変わらないのだけど、ページに留まるというのがミソ。ページに留まる時間が増えるということは、つまりそのページに挿入した広告が表示される時間が増えるということなので、広告収入を得る可能性の増加に直結する。

とかもっともらしいことを書いてみる。ウソ・・・とも言い切れないだろうけど、広告の表示される時間からイメージされる効果には程遠いと思う。検索語を拾ってアサマシの方が効果が高そう。