はじめまして
大阪開発の野村です。

今回は AsRederをより広範囲かつ簡単に使って頂けるようにする為のソリューションのご紹介をさせて頂きたく。

とはいっても、そんな御大層なものではなく、私がサンデープログラミングで作成した、弊社謹製の AsWeb（AsReaderと連携可能なブラウザアプリ）用の単一のHTMLファイルをWebサーバにアップするだけで動作可能なバーコードリーダーサンプルアプリです。

単一のHTMLファイルだけなので、どなたでも簡単に外観の変更・機能拡張が可能となっており、大変リーズナブルなサンプルとなっております。

画面イメージはこちらで

AsWeb上でページ表示をさせるとバーコード入力欄にフォーカスが当たった状態になっており、AsReaderでバーコードをスキャンすると中央部のバーコードのリストに追加され、数量がカウントアップされます。左上部のメニューボタンからはデータ送信、データクリア、設定パネルの表示、About表示などが選択できます。データ送信は設定パネルのデータ送信先URLに設定したURLにアプリ設定とスキャンした内容のJSONがPOST送信されるようにしています。もちろん、この辺りも気に入らなければ自由に改変してどうぞ。

そうそう言い忘れてましたが、アプリ名をASWebODM（AsWeb Offline Data Manager）としているのは、アプリ設定とスキャンした内容をローカルストレージに保存しており、AsWebを終了してページを閉じて再度開いても、前と同じ状態で起動されるようになっております。本当は完全なオフライン対応Webアプリにしたかったのですが、実現するのに必要な機能が作成した時点ではまだiOSのWebViewに入っていなかったので。。。そこが解決したら対応したいとは思っています。

そして、肝心のHTMLの中身ですが、アプリとしてはこちらで公開していて、GitHubPagesで動作を試せる様にしたデモURLも載せております。HTMLページは一階層下のこちらになってまして、少し見つけ難いかも。

全体的な作りの部分だけ簡単に説明させて頂きますと、JavaScriptライブラリは jQuery + Knockout.js、CSSライブラリは Materialize、アイコンフォントにGoogleのMaterial iconsを、それぞれ CDN配布されているものをインクルードしています。Knockout.jsを採用したのは jQueryだけだと入力データ等の移送コード記述が煩雑になるので、データバインディングを使って、シンプルに書きたいなと思って、いろいろ見てみた所、いい感じに枯れていて、MicrosoftのASP.NETとかにもバンドルされているという事だったので、これにしました。そのおかげで結構いろいろやってるにも関わらず、HTMLの行数は256行という非常にキリの良い行数に。

まとめますと AsReaderを導入する際にテスト導入段階からネイティブアプリの開発費用や他システム連携改修の費用を捻出するのは大変だな、といった際には工夫次第で簡単に試してみる事も可能という事です。もちろん本格的に御利用される場合は、それに見合った投資が必要というのは、世の常ではありますが。

それでは、今後とも格別のお引き立ての程をよろしくお願い申し上げます。