Phonegap-plugin-barcodescanner: phonegap/phonegap-plugin-barcodescanner » iOS 10/iPhone 6s Plus camera does not appear until after going to home screen and back into application

[tungcntt619]

[Rambatino]

Yup, I'm getting the same behaviour

[samscudder]

Same here... iPhone 5s iOS 10.1.1

[alsorokin]

Hey guys, I've tried to reproduce the issue on iPhone 5 (iOS 10.1.1) and iPad Pro (iOS 10.0.2) with no luck.
My env is:
OS X 10.11.6 (El Capitan)
XCode 8.1
Cordova 6.4.0
cordova-ios platform 4.3.1
Here's a sample of working code:

onDeviceReady: function() {
    var logDiv = document.getElementById("log_div");
    var barcode = cordova.plugins.barcodeScanner;
    logDiv.innerHTML = "scanning a barcode...";
    barcode.scan(function (success) {
        logDiv.innerHTML = success.text;
    }, function (failure) {
        console.log(failure);
    });
}

Camera appears on a first launch, along with the permission prompt.

Could you please share some more details about your environment and provide a code snippet which is not working for you?

[samscudder]

Environment:

OSX 10.11.6 - El Capitan
XCode 8.1 (8B62)
Cordova 5.4.0

Plugins in the project:

com.darktalker.cordova.screenshot 0.1.3 "Screenshot"
com.raananw.imageResizer 0.1.2 "ImageResizer"
cordova-plugin-app-version 0.1.8 "AppVersion"
cordova-plugin-compat 1.0.0 "Compat"
cordova-plugin-device 1.0.1 "Device"
cordova-plugin-device-orientation 1.0.1 "Device Orientation"
cordova-plugin-dialogs 1.2.0 "Notification"
cordova-plugin-file 3.0.0 "File"
cordova-plugin-globalization 1.0.2 "Globalization"
cordova-plugin-inappbrowser 1.2.0 "InAppBrowser"
cordova-plugin-network-information 1.0.1 "Network Information"
cordova-plugin-splashscreen 2.1.0 "Splashscreen"
cordova-plugin-statusbar 1.0.1 "StatusBar"
cordova-plugin-whitelist 1.0.0 "Whitelist"
cordova-plugin-x-socialsharing 5.0.7 "SocialSharing"
onesignal-cordova-plugin 1.10.1 "OneSignal Push Notifications"
org.apache.cordova.file 1.3.3 "File"
org.devgeeks.Canvas2ImagePlugin 0.6.0 "Canvas 2 Image"
org.pushandplay.cordova.apprate 1.1.7 "AppRate"
phonegap-plugin-barcodescanner 6.0.4 "BarcodeScanner"

This code is located in my login controller, which is declared like this:

app.controller('loginCtrl', function ($scope, $http, $bemStorage) {
     'use strict';

And the code that calls and processes the barcode is this:

$scope.getQRCode = function () {
    if (helpers.hasInternet()) {
        _onQRCode = true;
        cordova.plugins.barcodeScanner.scan(
          function (result) {
              if (result.format == 'QR_CODE') {
                  try {
                      var _code = JSON.parse(result.text);
                  if (_code.userToken) {
                      $scope.LoginQRCode(_code.url, _code.userToken, _code.systemToken);
                      return;
                  } else if (_code.systemToken) {
                      $scope.QRCodeEnv(_code.url, _code.systemToken);
                      return;
                  }
                  } catch (error) {
                     helpers.showMessage('Warning', error);
                  }

              }
              else if (result.text != '') {
                  helpers.showMessage('Warning', 'Invalid QR Code!');
              }
              _onQRCode = false;
          },

          function (error) {
              helpers.showMessage('Warning', error);
              _onQRCode = false;
          },
          {
              "formats" : "QR_CODE",
              "orientation" : "portrait"
           }
       );
    }
};

The button is declared in index.html like this:

<button class="button" ng-click="getQRCode()">Read QRCODE</button>

This is working fine on iOS 9 and below (I'm targeting 8 in Xcode), but on iOS 10, when first running the app, I don't get the scanner view until I press the home key, and tap on the app icon again. If I tap on cancel, and try and scan the barcode again, the scanner doesn't show up until I press the home key and tap on the app icon again.

If, from the app, I double click the home key, and select the app in the task list, the scanner view comes up too.

[alsorokin]

Tried with [email protected], targeting various iOS versions, including 8, and with your formats and orientation options. No dice, camera opens each time.
I didn't use angular though, but I don't think it can be a source of the problem.

[daserge]

@samscudder can you check if the if (helpers.hasInternet()) is the reason (is it true on first call)?
Does it reproduce on a blank Cordova app for you?

[samscudder]

@daserge it returns true on first call. I added a helpers.showMessage on the line immediately above the .scan() and it shows up OK. Just to be on the safe side, I commented out the if, with no change in the outcome.

@alsorokin Some more behavior: When I double click the home key, while the task list is showing, I can see the screen changing to the scanner view after maybe 1.5 seconds before I tap on the app again.

If I tap on my scan button twice, the second time function(error) is called with a "Scan is already in progress" error.

I don't even get the camera permission popup when I first run the program on a tethered iPhone until I re-tap the app icon, ou double click the home key.

[samscudder]

Just checked the ios platform version: 3.9.2

[fiveboxChile]

Same issue, I check the plist on xcode and show me this line

Privacy - Camera Usage Description: string: To scan barcodes

But when I call scan, nothing happend and recall scan, show me message error Scan is already in progress.

Other thing, when start app, never show me confirm permission to use camera.

[daserge]

@samscudder, @fiveboxChile - quick question - do you deploy from CLI or from XCode?

[samscudder]

@daserge Build and deploy from XCode (after a cordova prepare ios)

[fiveboxChile]

Guys !

I try this steps:

Update cordova to 6.4.0
Add plugin with description
Add platform [email protected]

And Work !!!

Camera start at first touch !

[fiveboxChile]

Sorry I forget,

I have the same problem, but with geolocation plugin. I think with the same steps it fixed. I hope

[daserge]

You probably meant [email protected]

[samscudder]

I'm not sure I can update cordova to 6.4.0 without breaking the app. Are there any incompatibilities?

I'm not the original developer, and not very experienced with cordova, but I do know a bit about javascript/html/css (nearly 20 years experience in web development).

[fiveboxChile]

You probably meant [email protected]

:D Sorry your right !

[daserge]

@samscudder it's hard to say but you can install cordova locally and test like so:
mkdir cordova6test && cd cordova6test
npm i [email protected]
node node_modules/cordova/bin/cordova create testProject
cd testProject
node ../node_modules/cordova/bin/cordova platform add [email protected]
...add plugins, prepare, setup developmentTeam, etc...

You can read what has changed in cordova@6 and ios@4 here:
https://cordova.apache.org/news/2016/01/28/tools-release.html
http://cordova.apache.org/announcements/2015/12/08/cordova-ios-4.0.0.html

[fiveboxChile]

Another tip

In some case, when click to open scanner freeze screen, The solution is change call in angular. Change ng-click for on-touch

PD: My English suck! Sorry :( I can read very well, but write too bad

[daserge]

@tungcntt619, @samscudder - have you got a chance to check if this is an issue with ng-click, guys?

[samscudder]

I don't think this is an ng-click issue, as the on click function gets triggered.

[daserge]

There was an issue with it that callback was being called twice: https://github.com/driftyco/ionic/issues/1022 - not sure if it was fixed or not.

[xavierfernandes]

This is due to the new content security introduced in iOS 10 to prevent XSS.

Replacing the

<meta http-equiv="Content-Security-Policy" content="default-src gap://ready file://* *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src 'self' 'unsafe-inline' *">

For more details read http://www.qed42.com/blog/ionic-iOS10-compatibility-csp

[aalfiann]

Thanks @xavierfernandes , now I got this working..

Here is my Content Security Policy:

<meta http-equiv="Content-Security-Policy" content="
    default-src gap://ready file://* *; 
    script-src 'self' 'unsafe-inline' 'unsafe-eval' *; 
    img-src 'self' data: *;
    style-src 'self' 'unsafe-inline' *">

Barcode Scanner is 100% working on phonegap. I've test using iPhone 5 iOS 10.

[KiaraGrouwstra]

Did the CSP edit fix this for others as well? I'm still experiencing the same behavior after applying it...

[jcesarmobile]

It should be gap:, not gap://ready, it should fix the problem.

[pwned555]

I have taken the steps above and when I build the app to a local device it works without issues. However when I sign and publish as an enterprise app then the behavior above takes place. Any ideas on what could cause this?

[amoizesmailacn]

Hi,

I'm encountering this issue using hybrid remote. Basically all my javascript files are stored in the remote and I'm accessing it, so far the Javascripts are loaded fine.

However, on my first install, on the first tap of the button that calls the barcode scanning, nothing happen, and when I press the home button, the Allow Camera Access dialog shown and after allowing it and tap again the scan barcode button, no camera scanning shown only an error message 'Scan is already in progress'.

[benftwc]

Hi,

I used to encountering this issue few days ago, I've fixed it by adding "gap:" to my CSP settings.

[lock[bot]]

This thread has been automatically locked.