在Ionic/Cordova中，是否可以同时预览相机并扫描条形码？

Question

我目前正在搜索与Cordova/Ionic/AngularJS在iOS和Android上兼容的内容，以下是我找到的一些快速概述，然后我会解释我想要实现的内容。我发现 cordova-plugin-camera-preview非常适合我想要采取的方法；基本上，将其嵌入我的HTML中而不离开我的应用程序。我还发现 quaggaJS 这个条形码扫描器很有趣。现在我使用了 cordovaBarcodeScanner 但它似乎退出了我的应用程序，这并不是我理想的方法。

我想要实现什么

在我的Ionic/Cordova移动应用程序中，我正在尝试实现实时预览条形码扫描器。因此，我的想法是我会导航到我的应用程序中的一个页面，该页面将启动一个嵌入式相机视图，并提供通过我的相机可以看到的实时视频流（ cordova-plugin-camera-preview提供的内容非常适合这种方法），但当然，这个插件不提供任何条形码（EAN）扫描能力。所以在这一点上，我发现了quaggaJS，它似乎是一个好的方法，然而，我目前无法让quaggaJS与我的Cordova项目配合使用，这真是遗憾。

我正在尝试实现的功能是否已经存在，或者是否可能使我所提到的两个插件与Cordova项目一起工作？

非常感谢您的任何帮助。

- MattVon

Answer 1

你可以使用QR Scanner Ionic Native Plugin，但是由于它只能扫描QR码，所以必须编辑源代码来添加所需的条形码格式。

对于Android，请编辑以下文件：/platforms/android/app/src/main/java/com/bitpay/cordova/qrscanner/QRScanner.java 在第457行之后：

formatList.add(BarcodeFormat.QR_CODE);
// add your [BarcodeFormat][2] here.

对于IOS，请编辑以下文件：/platforms/ios/yourapp/Plugins/cordova-plugin-qrscanner/QRScanner.swift

第156行：

metaOutput!.metadataObjectTypes = [AVMetadataObject.ObjectType.qr, ... comma_seperated_formats_here]

你还必须编辑第250行：

if ( (found.type == (AVMetadataObject.ObjectType.qr) && found.stringValue != nil) )

Like so:

if ( (found.type == (AVMetadataObject.ObjectType.qr) && found.stringValue != nil) ||
    (found.type == (AVMetadataObject.ObjectType.ean13) && found.stringValue != nil) || ..... )

- John Nik

---

感谢您花费时间和精力回复，我希望它能帮助其他遇到类似问题的人。在我的情况下，这个问题对我来说已经不再相关了，因为我已经转向了Xamarin - 而且原始项目是使用Ionic V1和AngularJS完成的，所以我不认为您的解决方案适用于我的旧项目。 - MattVon

谢谢John，这对我帮助很大！ - Daniel Hutton

Answer 2

我目前找到的是Scandit SDK，它提供了您想要的功能，但需要付费且价格有点贵。

目前我所做的是使用您提到的库以及qrcode JavaScript库来解码从相机预览中获取的图片，但速度不如Scandit。如果您找到更好的方案，请告诉我们。

- alanfortlink