Google Book APIを使って本のサムネイル画像を表示するJavaScriptを作る

ISBNコードを元に
本の表示の画像を表示したかったので
いろいろREST APIを公開しているサービスをみてみた。

ほとんどがアカウントを作成しないと取得できないタイプだったので
半分あきらめかけていたのだけど、
Google Book API ならセキュリティキーとか作成せずにできそうだったので
ためしてみた。

Google Book APIはISBNコードをハイフン無しのコード部分だけ
数字部13桁をGETのパラメータとして渡してやれば
JSONで情報がもどってくるしくみだ。

なのでjQuery1.11.1 (IEも対応する必要があったので..) を使って
JavaScript関数をつくり、

<script type="text/javascript">
function loadBookImage(){
 var isbnCode = $("#isbn").val();
 isbnCode = isbnCode.trim().toUpperCase().replace(/[^\dX]/gi, '');
 var googleUrl ="https://www.googleapis.com/books/v1/volumes?q=" + isbnCode;
 $.ajax({
  type: "GET",
  url: googleUrl,
  dataType: "json"
 }).done(function(json){
  var thumb = json.items[0].volumeInfo.imageLinks.thumbnail;
  if(thumb){
   $("#bookImage").empty();
   $("#bookImage").prepend("<img src='" + thumb + "'/>");
  };
 });
};
</script>

bodyタグ内に

• id値がisbnのinputタグ（onBlurにloadBookImage()を定義）
• id値がbookImageのdivタグ

を作って試すと、簡単に表示できた。

でも、たまにISBNコードと同じでないサムネイル画像が出る..

上記関数で１件目のサムネイル画像のみ使用しているのだけど、
候補が複数帰ってくる場合もあって
それでたまに違う画像が出てくる..

そのあたりは、もうすこし jQuery のAjax に慣れてからにしようかな..

Javaで書いたWebアプリをBluemixへデプロイする

Struts2＋VelocityでMVCを、
Spring Framework でDIとセキュリティを、
MyBatisでDAOを
それぞれ使ってPostgreSQL上のデータベースの入出力させる
ごくごくふつうのアプリをEclipse上で作った。

テスト環境としてローカルにTomcatとPostgreSQLを入れて
Eclipse上からテストしているが、
Bluemixをテスト環境にすればいいんじゃないかとおもい試してみた。

Bluemixサイトにログインして、
「CATALOG」タブから「Liberty for Java」を選択
名前、URL（ホスト名だけ）、選択プランを選ぶ。
でCREATEする。

そうすると作成したサーバ（？）のダッシュボードに遷移するので
「ADD A SERVICE」を選択する。
そして「Data Management」の「ElephantSQL」を選択する。
＃PostgreSQLでAWSで動いているらしい

で、App欄は先ほど作成したサーバの名前をいれ、プランを選択する。
Service name欄にはプログラム内で使っているJNDI名の"jdbc/"を
除いた文字列でCREATEする。

リスタート云々言ってくるのでOKボタンを押して再起動する。

作成したデータソースをクリックし、
Launch ElephantSQL Dashboard
を押すと、
URLが表示されるのでメモる。




そしてbluemixプラグインを入れたEclipseでサーバを作成、
同一アカウントでの接続を設定しておく。
で、Webアプリプロジェクトを作成したサーバへドラッグ＆ドロップすると
ダイアログがでてくるので、先ほど作成したAppsを選択すれば
デプロイ処理をしてくれる。

当然DB上にテーブルなどを作成しなくてはならないので
ローカルのpgAdmin(PostgreSQLをローカルにインストールすると
入ってくる管理コンソール)をたちあげ
コンセントマークのアイコンを押して
先ほどメモったURLを元にプロパティタブへ入力する。

例えば
postgres://hogehoge:fugafuga@foo.bar.com:5432/tar
である場合、
ホスト欄に「foo.bar.com」
Portに「5432」※もちろんproxy環境ではつながらない
データベースメンテナンス欄に「tar」
ユーザ名欄に「hogehoge」
パスワード欄に「fugafuga」
といれ（名前などは適当に入れて）「OK」ボタンを押すと接続できる。

データベース名は「tar」でこていになっているようなので
「tar」を選択して虫眼鏡アイコンを押してSQLを押し流せば良い。




本当はよくある組合せセット(boiler plate)のなかから選べばいいのだけど、
課金されることになったらをかんがえると一つ一つ必要な物だけ選んでいくのが
いいかな、とおもう。




とうぜん、tomcat-users.xmlでBASIC認証しているような場合は
アプリとしてログインを実装する必要がある。


簡単ではあるけど、SSLトンネリングとかの設定しないと
開発環境としてはめんどくさい。
なによりステップ実行できるわけではないし...

とりあえず、JNDI名で実装しとけばDBにはつながることが分かっただけでも
よしとしよう。