2021年1月9日土曜日

jsQRを組み込んでOracle APEXでQRコードを読み取る

 気になっていたので、扱いやすそうに見えたjsQRというJavaScriptライブラリを、Oracle APEXのアプリケーションに組み込んでみました。カメラがQRコードを認識したときに、ページ・アイテム(ここではQRコードからのデータ)に、読み取ったデータを設定しています。


こちらにjsQRが提供しているデモのページがあります。このデモのページのソースを、ほとんどコピペしてOracle APEXのアプリに組み込みました。

デモのコードの中に一行だけ、以下のコードをQRコードが認識されたときに実行される部分に追加しています。P1_QRCODEはページ・アイテムの名前です。

$s('P1_QRCODE', code.data);

この後にJavaScriptのコードを追加することで、QRコードを認識した時点で次の処理に遷移する、といったことも可能でしょう。

作成したアプリケーションはこちらからアクセスできます。

上記のアプリケーションのエクスポートをダウンロードできるよう、こちらにおきました。

テストはAppleのMacbook ProのSafariで確認しています。

Chrome, Edgeでは動かず、iPad, iPhoneでは動画としての取り込みをしてくれない(1秒くらいでビデオが止まる)ので、おそらくビデオ映像を取得するために呼び出しているnavigator.mediaDevices.getUserMediaにもっと詳しいオプションが必要だったり、デバイスを検知してオプションを切り替える、といった処理が必要なのではないか?と予想しています。

今回は動かすだけが目的だったので、これで完了です。実際のコードは、アプリケーションのエクスポートをインストールすると参照できます。