Yahoo! Shopping Web Services

US の Yahoo! が Shopping Web Services なる新しい API の公開を始めました。

You can use Yahoo! Shopping Web Services to search our database of millions of product offers and thousands of merchants. The API can be used to create applications that provide comparision shopping and product search functionality. Click on a link below to read documentation for the Shopping Web Services APIs.

Amazon Web Services の Yahoo! Shopping 版と言えば分かりやすいでしょう。Yahoo! Shopping の場合は日本の楽天のように、Yahoo! がいてその下に各ショップがぶらさがっているというサービスなので、それに併せた API になっている様子。

XML over HTTP な作りは他の Yahoo! API と一緒で、扱いが容易です。API はいまのところ

  • productSearch
  • catalogListing
  • merchantSearch

の三つ。商品のキーワードサーチ、商品IDによるリスティング、それからショップのサーチ、です。US の API なので、Yahoo! Japan のデータは検索できません。対応が待たれるところ。AWS のようにアフィリエイトと結びついているかどうかは調べきれてませんが、その要素はないのかな?

と、いうことで物は試しにちょっと使ってみました。クエリを投げて検索結果をブラウザで、というシンプルなウェブアプリです。例として iPod Shuffle の検索結果。レビューのページやレビューするページへのリンクがあったりするのがいいですね。

ys.gif

ソースはこれ。

CGI::Application::Dispatch と Template-Toolkit、あとなんちゃって API モジュールを作って XML::Simple で parse。XML の構造が比較的シンプルで分かりやすいので、XML::Simple で返ってきたデータ構造をちょっとだけいじってテンプレートに渡してマクロ展開するだけで、適当なものが作れそうです。

とは言っても、アサマシできない(?)し日本ではまだだし、ということでこれいじょう Hack するインセンティブはない、ということでまたもや絶賛放置です。

onsubmit で submit ボタンを disable にしてユーザビリティを良くする

先の Yahoo! Shopping のアプリケーションで、今度ちょっとやってみようと思ってたことを実装してみた。

ボタンを押したときに、そのボタンが disable になります。この方法を使うとボタンが押されて次の処理に入ろうとしているというのが直感的に分かるのと、二重送信防止にもなるということでユーザビリティが改善できます。

仕掛けはすごく簡単で、form の onsubmit ハンドラに、その form に紐づく submit ボタンを disable になるような JavaScript を登録しておくだけ。

function disableSubmit(form) {
  var elements = form.elements;
  for (var i = 0; i < elements.length; i++) {
    if (elements[i].type == 'submit') {
      elements[i].disabled = true;
    }
  }
}

という関数を用意しておいて、

<form method="get" onsubmit="disableSubmit(this)">
  <input type="text" name="q">
  <input type="submit" value="search">
</form>

と、onsubmit に指定すれば ok。

たとえばsubmitしたらJavaScriptでsubmitボタンを押せなくして多重ポストを防ぐとか、簡単にできるんだけど、実際に実装してるところは少ないよね。そういう面で好感が持てる。

もとはと言うと、このエントリーを読んで「へえ」と思い実際 Feedbringer を触ってみてこれはいいなと思い今度やってみようと思っていたものです。Feedbringer では body の onload 時にまとめて document.forms で form 全部を取得して onsubmit ハンドラへのイベント登録をやっていて、よりスマートな感じですね。

はてなのサービスにも搭載していきたいなあ。