Asterisk社員の技術情報ブログ

AsBrowserを使ったWEBアプリ

最終更新日:2018年12月01日
カテゴリー:

東京開発のイツキです。

iPhone/iPod + AsReaderを使ったモバイルPOSをサポートしています。

バレンタインに向けて1000台以上のモバイルPOSを全国の店舗に配布します。
iPod + AsReaderなら基本セットは以下となります。
・iPod touch
・AsReader(ASR-010D)
・AsReaderスタンド
・充電用USBケーブル
・USB充電器(5ポート)
・モバイルWIFIルータ
・レシートプリンタ
・レシートロール
・キャッシュドロア

これらを店舗に2セットだったり5セットだったり
USB充電器やモバイルWIFIの様に複数台に対して1つで良いものもあります。

繁忙期だけ催事場で追加で端末をご利用になるので
梱包して送るのですが、当然、催事が終わると回収します。

どこの店舗に何を送って、戻ってきたのか来てないのか?
これを管理するのが大変なのです。

という、話を前回の最後に記載しています。

はい、作りました。
もちろんAsReaderを使ってます。

モバイルPOSを送る箱(以下、送り箱)や、キャッシュドロアの箱にシリアルのバーコードを付けました。
出荷する時に送り箱のバーコードを読んで出荷登録して、返却時にも送り箱のバーコードを読みます。
これで返却時にどこの店舗から戻って来たのか直ぐに分かるようにしました。
宅配の送り状バーコードも登録するので、配送状況も確認できます。

予算も時間も無い中で、ちゃちゃっと作るためにAsBrowserを使ったWEBアプリにしました。
このAsBrowserを使ったWEBシステム開発ですが、私なりの開発手法を記載いたします。


AsBrowserの詳細はこちら

WEB画面上でバーコードを受け付けるのですが、だいたい皆さんテキストボックスを置きがちです。

例えば、宅配の送り状、送り箱NO、作業者NOのバーコードを読むシステムだとします。
1画面にテキストボックスを3つ置きますか?

目的のテキストボックスをタップして、フォーカスを当ててAsBrowserでスキャンしたら、、
値は入ります。
要件は満たしてます。

いや、面倒でしょ。
その操作性。。

わざわざタップして選択したくないんですよ。
勝手に入って欲しいのです。

例えば仮にバーコード体系が以下と仮定します。
宅配の送り状のバーコードは12桁の数字と決まっている
送り箱NOのバーコードは先頭が”BOX”と数字4桁から構成される
作業者NOバーコードは先頭が”A”と数字4桁から構成される

WEB画面にはテキストボックスなどフォーカス奪う物を一切置きません。
WEB画面自体のキーイベントで制御するのです。
JavaScriptでコード体系を解析して、画面上のテーブルの該当項目に表示させます。

すると、タップすることもなく、スキャンする目的の場所に値が入ります。

バーコード破損用に、各項目のクリックイベントでpromptを出して標準キーボードにも対応させます。

どうでしょう?
テキストボックスが無いと標準キーボードが邪魔することもないし、快適なバーコードライフがWEBアプリでも実現できます。
次はRFID化したいところですが、、

記事のカテゴリー