久々にMonaca使ったらハマった件

2020年3月25日 CEO 0 Comments

せっかくスマホアプリを作るなら、バーコードスキャナを作ってみたいと思い
始めたのがきっかけ。

以前投稿させていただいた記事はこちら↓

改めてMonacaとは?
アシアル社 HTML + CSS + javascript でハイブリットアプリ作成

-環境-

  • Cordova:9.0.1
  • Monaca Debugger:9.0.3
  • BarcodeScanner:8.0.1
  • iPhone:13.3.1(デバック機)

Monaca使って、Cordovaプラグインの
BarcodeScannerをつかっていたのですが、久々に動かしてみたら、

TypeError: undefined is not an object (evaluating….

というエラーが発生し、該当のjavascriptが動かなくなってしまいました。。

githubに上げていたので、作成日を見ると2018/10/31。

https://github.com/tatsunoriuehera/barcode_scan

1年以上放置していたので、エラーが起きても仕方ない。

ググってみると、BarcodeScannerは廃止されるようです。

Cordova 9.0 以降では廃止となりました。 
PhoneGap BarcodeScanner プラグイン をご使用下さい。

https://docs.monaca.io/ja/reference/third_party_phonegap/barcode_scanner/

ということでPhoneGap BarcodeScanner プラグインに切り替えます。

プラグインを追加してから、筆者はiOSをデバックの機種としている為、
記述のとおり、config.xmlにedit-configを追加します。

追加する場所はとりあえず platform name=”ios” 内に追記してみました。

そして使用例を元にjavascriptを追加して、デバックしてみると?

エラーは出ず、バーコードリーダーが起動するが、読み込めない?

-結果-

javascript内のココが重要でした。

preferFrontCamera : false, // iOS and Android//カメラの選択
showFlipCameraButton : false, // iOS and Android//カメラ切替ボタンの有無
showTorchButton : false, // iOS and Android//フラッシュボタンの有無
torchOn: true, // Android, launch with the torch switched on (if available)
saveHistory: true, // Android, save scan history (default false)
prompt : "Place a barcode inside the scan area", // Android
resultDisplayDuration: 500, // Android, display scanned text for X ms. 0 suppresses it entirely, default 1500
formats : "QR_CODE,PDF_417", // default: all but PDF_417 and RSS_EXPANDED//読み取るバーコードの種類
orientation : "landscape", // Android only (portrait|landscape), default unset so it rotates with the device
disableAnimations : true, // iOS
disableSuccessBeep: false // iOS and Android//読み取り成功の音の有無

(コメント追記はiOSのみ)

formatsが”QR_CODE”になっていました。

ここを変えれば、他のバーコードがスキャンできます。
以下にてサポートされているバーコードタイプが確認できます。

Github

https://github.com/phonegap/phonegap-plugin-barcodescanner

以上、誰かのお役に立てれば幸いです。。