Ionic BarcodeScanner 不适用于 ios

Question

我创建了一个 ionic 应用程序，它在 android 上运行良好。但是条码扫描仪在 ios.

中无法正常工作

我的代码；

$cordovaBarcodeScanner.scan().then(function (barcodeData) {
  console.log("Data : "+barcodeData.text);
});

但是XCODE不停地给我这样的东西；

当我尝试这样做时；

  cordova.plugins.barcodeScanner.scan(
  function (result) {
      alert("We got a barcode\n" +
            "Result: " + result.text + "\n" +
            "Format: " + result.format + "\n" +
            "Cancelled: " + result.cancelled);
  }, 
  function (error) {
      alert("Scanning failed: " + error);
  },
  {
      "preferFrontCamera" : true, // iOS and Android
      "showFlipCameraButton" : true, // iOS and Android
      "prompt" : "Place a barcode inside the scan area", // supported on Android only
      "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
  }
};

出现此错误：

Warning: Attempt to present <CDVbcsViewController: 0x15f30c400> on <MainViewController: 0x15dd4fab0> whose view is not in the window hierarchy!

Answer 1

我之前遇到过扫描仪问题，无缘无故当我点击按钮启动扫描仪功能时它触发了两次...所以我不得不换个方法。

HTML

<button class="button button-positive" ng-click="scanBarcode()">Scan</button>

控制器

$scope.scannerOpened = false;

$scope.barcodeSearch = function() {
    if(!$scope.scannerOpened) {
        $scope.scannerOpened = true;
        $ionicPlatform.ready(function() {
            $cordovaBarcodeScanner.scan().then(
                function(result) {
                    alert(result);
                },
                function(error) {
                    alert(error);
                }
            ).finally(function() {
                $scope.scannerOpened = false;
            });
         });
    }
}

Answer 2

通过这样做，我可以扫描 iOS 中的二维码。

添加iOS平台：
```
ionic platform add ios
```
安装 ngCordova
```
bower install ngCordova
```

像这样添加了 Barcodescanner 插件：

cordova plugin add https://github.com/phonegap/phonegap-plugin-barcodescanner.git

index.html

<button class="button button-block button-positive" ng-click="scanBarcode()">
      <i class="icon ion-qr-scanner"></i>
      Scan Now
</button>

app.js

angular.module('myApp', ['ionic','ngCordova']) // include ngCordova

// Scan 
angular.module("myApp").controller('scanner',function($scope, $cordovaBarcodeScanner) {
$scope.scanBarcode = function() {
$cordovaBarcodeScanner.scan().then(function(imageData) {
    alert(imageData.text);
    console.log("Barcode Format -> " + imageData.format);
    console.log("Cancelled -> " + imageData.cancelled);
}, function(error) {
    console.log("An error happened -> " + error);
});
};
});

我的nodejs版本：v5.5.0

Phonegap 版本：6.0.2

离子版本：1.7.14

Answer 3

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.Project" version="0.0.4" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
  <name>Masada</name>
  <description>
       Masada Mobile
    </description>
  <author email="mail@gmail.com" href="http://example.com/">
      Company
    </author>
  <content src="index.html"/>
  <access origin="*"/>
  <preference name="webviewbounce" value="false"/>
  <preference name="UIWebViewBounce" value="false"/>
  <preference name="DisallowOverscroll" value="true"/>
  <preference name="android-minSdkVersion" value="16"/>
  <preference name="BackupWebStorage" value="none"/>
  <preference name="SplashScreen" value="screen"/>
  <preference name="AutoHideSplashScreen" value="true"/>
  <preference name="ShowSplashScreenSpinner" value="true"/>
  <preference name="SplashScreenDelay" value="3000"/>
  
  
  <feature name="StatusBar">
    <param name="ios-package" value="CDVStatusBar" onload="true"/>
  </feature>
  <platform name="android">
    <splash src="resources\android\splash\drawable-land-ldpi-screen.png" density="land-ldpi"/>
    <splash src="resources\android\splash\drawable-land-mdpi-screen.png" density="land-mdpi"/>
    <splash src="resources\android\splash\drawable-land-hdpi-screen.png" density="land-hdpi"/>
    <splash src="resources\android\splash\drawable-land-xhdpi-screen.png" density="land-xhdpi"/>
    <splash src="resources\android\splash\drawable-land-xxhdpi-screen.png" density="land-xxhdpi"/>
    <splash src="resources\android\splash\drawable-land-xxxhdpi-screen.png" density="land-xxxhdpi"/>
    <splash src="resources\android\splash\drawable-port-ldpi-screen.png" density="port-ldpi"/>
    <splash src="resources\android\splash\drawable-port-mdpi-screen.png" density="port-mdpi"/>
    <splash src="resources\android\splash\drawable-port-hdpi-screen.png" density="port-hdpi"/>
    <splash src="resources\android\splash\drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
    <splash src="resources\android\splash\drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
    <splash src="resources\android\splash\drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
    <icon src="resources\android\icon\drawable-ldpi-icon.png" density="ldpi"/>
    <icon src="resources\android\icon\drawable-mdpi-icon.png" density="mdpi"/>
    <icon src="resources\android\icon\drawable-hdpi-icon.png" density="hdpi"/>
    <icon src="resources\android\icon\drawable-xhdpi-icon.png" density="xhdpi"/>
    <icon src="resources\android\icon\drawable-xxhdpi-icon.png" density="xxhdpi"/>
    <icon src="resources\android\icon\drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
  </platform>
  <platform name="ios">
    <splash src="resources\ios\splash\Default-568h@2x~iphone.png" width="640" height="1136"/>
    <splash src="resources\ios\splash\Default-667h.png" width="750" height="1334"/>
    <splash src="resources\ios\splash\Default-736h.png" width="1242" height="2208"/>
    <splash src="resources\ios\splash\Default-Landscape-736h.png" width="2208" height="1242"/>
    <splash src="resources\ios\splash\Default-Landscape@2x~ipad.png" width="2048" height="1536"/>
    <splash src="resources\ios\splash\Default-Landscape~ipad.png" width="1024" height="768"/>
    <splash src="resources\ios\splash\Default-Portrait@2x~ipad.png" width="1536" height="2048"/>
    <splash src="resources\ios\splash\Default-Portrait~ipad.png" width="768" height="1024"/>
    <splash src="resources\ios\splash\Default@2x~iphone.png" width="640" height="960"/>
    <splash src="resources\ios\splash\Default~iphone.png" width="320" height="480"/>
    <icon src="resources\ios\icon\icon.png" width="57" height="57"/>
    <icon src="resources\ios\icon\icon@2x.png" width="114" height="114"/>
    <icon src="resources\ios\icon\icon-40.png" width="40" height="40"/>
    <icon src="resources\ios\icon\icon-40@2x.png" width="80" height="80"/>
    <icon src="resources\ios\icon\icon-50.png" width="50" height="50"/>
    <icon src="resources\ios\icon\icon-50@2x.png" width="100" height="100"/>
    <icon src="resources\ios\icon\icon-60.png" width="60" height="60"/>
    <icon src="resources\ios\icon\icon-60@2x.png" width="120" height="120"/>
    <icon src="resources\ios\icon\icon-60@3x.png" width="180" height="180"/>
    <icon src="resources\ios\icon\icon-72.png" width="72" height="72"/>
    <icon src="resources\ios\icon\icon-72@2x.png" width="144" height="144"/>
    <icon src="resources\ios\icon\icon-76.png" width="76" height="76"/>
    <icon src="resources\ios\icon\icon-76@2x.png" width="152" height="152"/>
    <icon src="resources\ios\icon\icon-small.png" width="29" height="29"/>
    <icon src="resources\ios\icon\icon-small@2x.png" width="58" height="58"/>
    <icon src="resources\ios\icon\icon-small@3x.png" width="87" height="87"/>
  </platform>
  <platform name="wp8">
    <splash src="resources\wp8\splash\SplashScreenImage.png" width="768" height="1280"/>
    <icon src="resources\wp8\icon\ApplicationIcon.png" width="99" height="99"/>
    <icon src="resources\wp8\icon\Background.png" width="159" height="159"/>
  </platform
  <icon src="resources\android\icon\drawable-xhdpi-icon.png"/>
</widget>

Answer 4

我的二维码由 16 个字符组成。这是我的问题的原因，现在已经解决了。谢谢@Pushpa。

Answer 5

查看 ios 库，它只包含以下类型的格式，因此不适用于 iOS。如果你在ios中找到一些使用ionic扫描PDF417的方法，你可以分享它！

typedef enum BarcodeFormat {
    BarcodeFormat_None = 0,
    BarcodeFormat_QR_CODE,
    BarcodeFormat_DATA_MATRIX,
    BarcodeFormat_UPC_E,
    BarcodeFormat_UPC_A,
    BarcodeFormat_EAN_8,
    BarcodeFormat_EAN_13,
    BarcodeFormat_CODE_128,
    BarcodeFormat_CODE_39,
    BarcodeFormat_ITF
} BarcodeFormat;

我邀请您查看 phonegap-plugin-barcodescanner, type PDF417 bar-codes using ionic

中的回复

Answer 6

iOS10+

中的隐私设置

iOS 10+ 的一个重大变化是您必须提前声明对私人数据的任何访问，否则您的应用程序将崩溃。

一旦您 link 使用 iOS 10+，您必须声明对任何用户私有数据类型的访问权限。您可以通过向应用程序的 Info.plist 添加一个使用密钥以及一个目的字符串来完成此操作。算作私有数据的框架列表很长

联系人、日历、提醒、照片、蓝牙共享、麦克风、相机、位置、健康、HomeKit、媒体库、Motion、CallKit、语音识别、SiriKit、电视提供商。

您需要将 "NSCameraUsageDescription" 放入您的 plist。

喜欢

关键：-隐私-相机使用说明

类型：- 字符串

值：- $(PRODUCT_NAME) 使用相机

enter image description here

Answer 7

我遇到了同样的错误，找了两天都没有成功

安装文件打开插件：enter link description here

然后使用

 Encode(textToEncode){

this.barcodeScanner.encode(this.barcodeScanner.Encode.TEXT_TYPE,
  textToEncode).then((data) =>{
    
    this.fileOpener.open(data.file, 'image/jpeg');
   
  },(err)=>{
    alert(JSON.stringify(err));
  })

}

一切正常

结果截图在这里

Ionic BarcodeScanner 不适用于 ios

Ionic BarcodeScanner does not work on ios

barcode-scanner

phonegap-plugins

angularjs

cordova

ionic-framework