見出し画像

【Click】バーコードスキャナーとAPIで本のISBNデータを取得してみた

(なぜこれを書いたか?)
Clickの質問コーナーに「バーコードスキャナーを使って本のバーコードを読み込み、本のISBNデータを取得したい」という投稿がありました。
以前私も同じようなことを考え、アプリを作ったことが有るので参考までに自分の作ったアプリを紹介します。

バーコードスキャナーで本の裏表紙のバーコードからISBN番号を読み取り、ここからAPIを使ってISBNデータ(タイトル、著者、発行日、出版社等)を取得するというのが今回の内容です。

1.APIはopenBDを使うことにした

(はじめに)
本の各種データはISBN番号というもので管理されており、それは本の裏表紙にあるバーコードから読み取ることが出来ます。これは世界中で出版されている本に対して行われており、ISBN番号が分かれば本のタイトル、著者、発行日、出版社、その他の情報が分かってしまうというすぐれものです。

本のバーコードは下記画像のように通常2つ印字されており、上の方がISBN番号のデータで、下が分類コードと言われるデータを含んでいます。今回は上の方のバーコードをスキャンすることになります。

操作の流れとしては、まずバーコードリーダーでISBN番号を読み取り、本の情報を管理しているAPIにアクセスします。その後、対応するISBN番号から各種情報を引き出すという形になります。

(APIは何がいいのか?)
本の情報を管理しているAPIとしては国会図書館API、Google Books API等が有名です。いろいろ試した結果、今回はopenBD(※BDはBookDataの意味)というAPIを使うことにしました。こでは無料で、しかも登録不要なので使い勝手がいいのです。

最初はGoogle Books APIを使ってやっていたんですが、出版社の情報がどうしてもうまく入手できなくて、あきらめてopenBDを使うことにしました。(出版社の情報は欲しいですよね)

GoogleBooksAPIには出版社のデータが含まれてないという事ではありません。ClickでJSONデータを取得してそれを表示する場合、うまく表示できないんです。(JSONデータの構造によります。Clickのせいではありません)

2.こんなアプリを作りました

①アプリのイメージ
作ったアプリのイメージを以下に示します。バーコードを読み取って以下の5つのデータを取得し、カスタムリストに表示しました。
・ISBNデータ
・タイトル
・著者
・発行日
・出版社

②バーコードスキャナーの設定
ホーム画面にバーコードスキャナーを配置してスキャナーがバーコードを読み取った時のClickFlowを設定します。

ClickFlowの内容:
スキャナーでバーコードの内容(ISBN番号)を読み取ったらその内容がインプット1に転送されます。インプットにISBN番号を書き込むのでClickFlowは「エレメント値の変更」を使います。

③データベースの準備
今回、ISBN番号、タイトル、著者名、発刊日、出版社名の5つの項目で構成されるデータベースを作りました。
データベース名:「本データ」

3.API関連の設定

ホーム画面に設けたボタンに API(openBD)にアクセスするClickFlowを設定します。

①カスタムClickFlowの設定
APIにアクセスする場合はカスタムClickFlowという特別なClickFlowを設定します。新カスタムClickFlowを選択するとGeneral API設定画面に表示が変わります。

②General APIの設定画面

新カスタムClickFlowを選択すると以下の画面が開きます。以下の4カ所を設定します。
1.名前:「ISBNデータ」としました。(ここは任意です)
2.変数の追加
 ISBN番号を変数として定義し、URLの中に入れてやります。「試験値」には実際に存在するISBNを設定します。テストボタンを押すとこの試験値でデータを取ってきます。
3.APIのURL(エンドポイント)
 「https://api.openbd.jp/v1/get?isbn=(isbnの番号)&pretty」
※URL最後の&prettyは戻り値のJSONデータをきれいに(pretty)整形してくれます。見やすくなるので入れています。
4.種類:「GET」(データを取得するのでHTTP通信のGETを選択します)

③画面下部の「テスト」ボタンを押す
APIにISBN番号を送信すると通信がうまく行った場合、戻り値として以下のようなJSONデータが返ってきます。

openBDの場合一番下のsummary(まとめ)の部分にisbn番号、本のタイトル、出版社、著者等の情報がまとまっています。ここの部分のデータをClickFlowで取り込む設定を後ほどします。

④「データの作成」ボタンを押す
画面一番下の「データの作成」ボタンを押してGeneralAPIで設定した内容を保存します。(上記画像では「データの更新」となっていますが、一番最初は「データの作成」という表記になっています。)

この画面を消してホーム画面に戻り次の設定に移ります。

3.ClickFlowの設定

上記のGeneralAPIの設定でisbn番号を送ると本の登録内容が入手できるようになりました。(※GeneralAPIの設定は「ISBNデータ」という名前で登録してあります。)

①以下の2つのClickFlowを設定します
1.  ISBNデータ
・・・インプット1に書き込まれたisbn番号をAPIに送信し、本の登録データをJSONで入手します。
2. 本データ作成
・・・本の登録データがJSONで返ってくるので、その中から必要なデータを入手し、それを「本データ」というデータベースに送信します。

今回は「ISBNデータ」という名前でGeneral APIを設定しているので、ISBNデータという項目にマウスを合わせると以下のようなデータ一覧が表示されます。この中から自分が必要なデータを選択します。

入手したJSONデータのうちデータベースに送信されるデータは以下のような設定になります。
ISBN :    ISBNデータ>summary.isbn
タイトル:ISBNデータ>summary.title
著者 : ISBNデータ>summary.author
発刊日: ISBNデータ>summary.pubdate
出版社: ISBNデータ>summary.publisher

②その他の設定
一応上記の設定でISBN番号を読み込んで本のデータをAPIから持って来ることが出来るようになります。しかし、自分で何度かやっているうちに不具合を発見しました。

バーコードスキャナーでISBNデータを入手しないうちに間違ってボタンを押してしまうと空白データがデータベースに飛んで行ってしまいます。対策としてデータベースの作成のClickFlowに以下のような動作条件を付けました。(ISBNデータが入るインプット1が空白でないという条件です。空白の時は動作しません)

その他にも、レスポンスが悪く、ISBNデータを送っているのにもかかわらず空白データが返ってくることがたまにありました。もう一度やるときちんとデータが返ってきました。

4.最終アプリ

参考のためアプリを載せておきます。使ってみて下さい。

(余談)
今回ISBN番号をバーコードスキャナで読み込んでそれ以降の処理をボタンにClickFlowで設定してありますが、皆さんの中には「ボタンは必要なく、バーコードスキャナのClickFlowで全自動で処理が出来るのでは」と感じた方もいるかも知れません。

私は最初その方向でアプリを作っていましたが、実際使ってみるとバーコードスキャナーでバーコード(ISBN番号)が確実に読み込まれたかどうかが分からず、何度か失敗してしまいました。

そこで1クッション置くためにわざわざボタンを配置し、スキャナーでISBNコードを確実に読み込んだことが分かったら人手でボタン押してそれ以降のデータ読み込み処理が行われるように変更しました。

このアプリは特段難しい箇所は無いのですが、実際使ってみると改良する箇所がいろいろあり、確実に動作する使いやすいアプリを作るのは結構大変だなという感じがしました。


この記事が気に入ったらサポートをしてみませんか?