ECSライブラリ

2006年01月05日 はてなブックマーク livedoorクリップ

ECS4.0用ライブラリ(Ajax用javascript)

ECS4.0のJSON配列から更に便利に利用できるようにする為のJavascriptのクラス。2006/01/05、Ver1.2.0UP。

確認しているECS4.0のバージョンは”2005-10-05”です。それ以前のバージョンの場合、使えない可能性があります。

[ダウンロード]

[最新版]
ECS.ItemSearchクラス(Ver1.2.0) ・・・ Operation-ItemSearchからデータ作成
ECS.ItemLookupクラス(Ver1.2.0) ・・・ Operation-ItemLookupからデータ作成

[旧バージョン]
ECS.ItemSearchクラス(Ver1.1.0) ・・・ Operation-ItemSearchからデータ作成
ECS.ItemLookupクラス(Ver1.1.0) ・・・ Operation-ItemLookupからデータ作成

[デバッグ用]
ECS.ItemSearchダンプ ・・・ ECS.ItemSearchの全データをHTMLに出力
ECS.ItemLookupダンプ ・・・ ECS.ItemLookupの全データをHTMLに出力
※デバッグ用も後付で作った為、十分にテストしたわけではないのでバグがあったら報告お願いします。

↓以下、詳しい解説。↓


[注意書き]

利用頻度低そうな項目は作成対象外にしています。増やしたい項目があったらコメントorトラバしてもらうか、ソースの改変も可能なので自由に変更・拡張してもらっても構いません(その場合でもソース上部のコメントは削除しないでください)。

※実際にはJSON配列に変換した段階でもJavascriptで利用可能ですが、このクラスを使えば更に楽ににデータにアクセスできます。
※厳密にはJavascriptにクラスはないですが便宜上「クラス」と呼ぶことにします。

[Ver1.1.0から1.2.0の変更点]

画像クラスにgetURLメソッドを追加。以前バージョンでは画像のURLはECSから受け取ったデータを直接返していましたが、画像にオプションを付ける事で「割引率」や「画像の回転」、「影の追加」等色々できるようになります。オプションはサイズ以外すべて手動設定なので、オプションの知識がない人は使えません(今後改善するかもしれません)。画像のオプションについて知りたい方はAmazonの画像作成ルールを参照してください。


[利用手順]

1.CGI等からECS4.0からXMLを取得(テストとかなら別に生のXMLでもOK)。
2.XMLをJSON配列に変換。
3.JSON配列をダウンロードしたECSクラスに変換。
4.あとはゴリゴリJavascriptを書く(この時点でXMLデータは消しても構わない)。
※1,2については、ECS4.0のXML受信についてを参照の事。説明足りなかったらゴメンナサイッ。

[簡単なサンプル]

<html>
<head>
<script type="text/javascript" charset="utf-8" src="jkl-parsexml.js"></script>
<script type="text/javascript" charset="utf-8" src="ecs-itemsearch.js"></script>
<body>
<script type="text/javascript">
var url = 'test.xml' // 実際の使用時にはURLを入れる。
var http = new JKL.ParseXML(url);
var json = http.parse();
// ここからItemSearchクラス使用
var is = new ECS.ItemSearch(json);

var data = '';
if (is.isValid()){
	for (var i = 0; i < is.itemCount; i++){
		data += 'ASIN:' + is.Item[i].asin + '<br />';
		data += 'タイトル:' + is.Item[i].title + '<br />';
		data += '<img src="' + is.Item[i].Image.Medium.url + '" alt="画像(中)"/><br />';
		data += '現在の価格:' + is.Item[i].Price.New.formattedValue + '<br />';
		data += '<br />';
	}
}
document.write(data);
</script>
</body>
</html>

※ECS.ItemLookupもItemが配列でないことを除けばほぼ同じ。なので以下明記しない限り、ItemSearchのみ記述


[大まかな規則]

・XML取得時のパラメタ-ResponseGroupの内容に関しては、特に問いません。必要なものをチョイスしてください。データがなければクラス自体作成されません(例えば、ResponseGroupにReviewsを指定しなければECS.ItemSearch.Item.Reviewsクラスは作成されません)。ちなみに作成にあたってベースとなっているResponseGroupは、"Small,ItemAttributes,Images,Offers,Reviews,EditorialReview,Tracks"です。

・ItemSearch以下の階層のクラス(例えばECS.Search.Itemクラス)は複数存在する場合のみ配列とします(Itemが一つの場合は配列とはせず、Item[0].asinではなくItem.asinのようにします)。
※従って、Javascript側では"instanceof Array"等で条件分けする必要があります。

・各メンバー変数も同じ理屈ですが、ECS.ItemSearch.Item.Attributesクラスの"author"、"actor"、"director"、"artist"、"format"とECS.ItemSearch.Item.Tracks.Discクラスの"track"に関してのみ例外で強制的に配列とします(利便性の為にしたつもりですが、分かりにくかったらスイマセン)。

[クラス概要]

0 ECS.ItemSearchクラス・・・基本クラス
 1 ECS.ItemSearch.Requestクラス・・・リクエストクラス(リクエストしたキーワード、ページ等)
 1 ECS.ItemSearch.Errorクラス(配列の場合あり)・・・エラークラス(エラー発生時のみ)
 1 ECS.ItemSearch.Itemクラス(配列の場合あり)・・・Itemクラス(商品情報)
  2 ECS.ItemSearch.Item.Image・・・画像クラス(データは下位クラスに委譲)
   3 ECS.ItemSearch.Item.Image.Small・・・画像小クラス
   3 ECS.ItemSearch.Item.Medium.Medium・・・画像中クラス
   3 ECS.ItemSearch.Item.Large.Large・・・画像大クラス
  2 ECS.ItemSearch.Item.Attributes・・・商品に付随する情報クラス(著者・在庫状況等)
  2 ECS.ItemSearch.Item.Price・・・価格クラス(データは下位クラスに委譲)
   3 ECS.ItemSearch.Item.Price.Fixed・・・定価クラス
   3 ECS.ItemSearch.Item.Price.New ・・・新品価格クラス
  2 ECS.ItemSearch.Item.Reviews・・・レビュークラス
   3 ECS.ItemSearch.Item.Reviews.Review(配列の場合あり)・・・顧客レビュークラス
   3 ECS.ItemSearch.Item.Reviews.EditorialReview(配列の場合あり)・・・Amazonのレビュークラス
  2 ECS.ItemSearch.Item.Tracks・・・トラックスクラス(データは下位クラスに委譲)
   3 ECS.ItemSearch.Item.Tracks.Disc(配列の場合あり)・・・ディスククラス(ディスク内の曲名リスト)

[ダンプの利用方法]

メンバー変数に関しては数が多くなるので、ダンプして中身を見たほうが分かりやすいと思います。なので、以下ダンプのHTMLサンプルソース。

<html>
<head>
<script type="text/javascript" src="jkl-parsexml.js"></script>
<script type="text/javascript" src="ecs-itemsearch.js"></script>
<script type="text/javascript" src="ecs-is-dumpHTML.js"></script>
</head>
<body>
<script type="text/javascript">
var http = new JKL.ParseXML("test.xml");
var json = http.parse();

var is = new ECS.ItemSearch(json);

document.write(is.dumpHTML());
</script>
</body>

[ちょっと一息]

随分長くなったので、ちょっとコラムちっくに。クラスが多階層になっているので一見ややこしそうに見えるかもしれませんが、なるべく意味の分かりやすいクラスにしたので覚えると楽に作成できると”個人的に”思っています。基本的にはECSから受信するXMLに似せた形になっていますが、階層は分かりやすく、更に「価格」や「在庫の状況(発送時期)」等のデータはECSの形式では分かりづらいので、「価格」はPriceクラスに、「在庫状況」はAttributesクラスに入れ込んでいます。

また多階層にしているのは、拡張のし易さというのが理由です。既存のソースをほとんど修正せずに、クラスを追加するだけで拡張できるような作りにしています。多階層化することで、ほぼ名前が重複しないはずです。一緒に配布しているダンプみたいに別ファイルに関数を書いて「なんちゃって継承」みたいなこともできます。

中古価格は今回クラス作成対象外としています。自分が使わないので、作りながらちょっと「マンドクセ('A`)」っていう状態になってやめたというのが本音ですが・・・。そこはソースいじって、自由に拡張してもらえばいいと思います。


[分かりにくいメンバ変数・メソッドについて]

ECS.ItemSearch.isValid()
 ・・・データの存在有無(true or false)。正しいXMLでない場合も"false"を返す。 [メソッド]
ECS.ItemSearch.totalCount
 ・・・検索結果の総数
ECS.ItemSearch.pageCount
 ・・・ページの総数
ECS.ItemSearch.itemCount
 ・・・取得したデータのItem数。"is.Item.length"のように自分で書いても同じ
ECS.ItemSearch.Request.page
 ・・・現在のページ(リクエストしたページ。リクエスト時にページを指定しなかった場合は"1")
ECS.ItemSearch.Item.url
 ・・・ECSから取得した商品のディテールURL
ECS.ItemSearch.Item.getURL('[あなたのアソシエイトID]')
 ・・・指定したアソシエイトIDからディテールURLを作成 [メソッド]
ECS.ItemSearch.Item.Attributes.stockStatus
 ・・・商品の在庫状況

※URLはECS.ItemSearch.Item.getURL('[あなたのアソシエイトID]')で指定した方がいいと思われます。ECS.ItemSearch.Item.urlで指定すると紹介料+2%上乗せが発生しないという噂も(嘘だといいんですけどね(ノ∀`))。リクエストした時のアソシエイトIDをそのまま使いまわすなら、以下のように書いてください。
is.Item.getURL(is.associateTag)
・・・ isはサンプルのECS.ItemSearchオブジェクトを指しています

[Ver1.2.0の追加メソッド]

※この追加メソッドは複雑なので、ダンプでは出力していません。

ECS.ItemSearch.Item.Image.getURL('[サイズ]', '[オプション文字列]')
 ・・・画像のURLを作成 [メソッド]
・[サイズ] → ”S”、”M”、”L”のいずれか(省略時は'S'の画像)
・[オプション文字列] → オプション毎に”_”(アンダーバー)で区切る必要あり(両端はあってもなくても可。省略時は何もしない)。
 例:・・・.Image.getURL('M', 'PE20_PU10');→20%OFFを右下に表示し、10度時計回りに回転

投稿者 shiz : 2006年01月05日 22:47

トラックバック

このエントリーのトラックバックURL:
http://mt.amonya.com/mt-tb.cgi/7

※トラックバックのリンク確認後に掲載させて頂きます。
(当エントリー又は当サイトへのリンクがない場合は掲載しません)


» Amazon Web Service Tips from PukiWiki (PukiWiki/TrackBack 0.3)
Webプログラミング 2006-12-14 Amazon Wev Service Tips † ↑参考サイト †... [続きを読む]

トラックバック時刻: 2006年12月14日 17:59

コメント
コメントしてください




保存しますか?