Piece of code in mdg:camera works in cordova android, but not ios

Hi everyone, here’s my github issue: iOS-device: undefined is not an object (evaluating 'navigator.camera.getPicture') · Issue #93 · meteor/mobile-packages · GitHub

I’ve basically got a call to MeteorCamera.getPicture in a ‘click #takePicture’ Template event handler.

In Android, when we click #takePicture, it opens up our camera. In iOS, a TypeError is thrown, revealing that navigator.camera is undefined.

Has anyone run into this problem before? I doubt it’s a problem with the iPhone or security settings. The problem seems to be in the js or load order somewhere. We ‘meteor add mdg:camera’ as usual, and expected it to ‘just work’. Is there something special for iOS?

Thanks

Can you add a code example? In general it should work. Are you using it inside a package or just in the app?

I’m using it inside the app, the package is added regularly, mdg:camera lies in my packages file.

It really is working great on Android. Here’s my code on iOS/Android/Browser

Meteor.startup(function(){
  console.log(navigator.camera)
  //prints [object Object]" in android client console
  //prints "undefined" in ios client console
})

No you try to call navigator, that’s not what you should do. Use the package methods, they abstract all that stuff out.

Also did you see this:

Warning: In the iOS simulator, the device camera is not accessible so you will get an error that says “source type 1 not available.”
I’m working on a fallback for iOS that will use the photo library when the camera is not available, but for now just test in your web browser, a physical device, or the Android simulator.
The trusted source for JavaScript packages, Meteor resources and tools | Atmosphere

Also, MeteorCamera.getPicture is throwing this error in iOS but not Android:

Template.picture.events({
  'click #pic, click #placeholder': function(event,self){
    if (Meteor.isCordova){
      MeteorCamera.getPicture({width: 150, height:150, quality:20})
      //MeteorCamera.getPicture calls navigator.camera.getPicture underneath
      //which ends up working on Android but not iOS.
    }
  }
})

I saw the warning in the docs, but that warning does not apply here, since we’re using an iOS device.

Try something like this:

Template.picture.events({
  'click #pic': function(event,self){
    MeteorCamera.getPicture(
      {width: 150, height:150, quality:20},
      function(error, data) {
        alert('error: ' + error);
        alert(data);
      }
    );
  }
})

I noticed you don’t have the callback which is an issue. Also you have 2 events you try to catch but that might run into issues because of event propagation. So use one onclick event first and a simple debugging example. It seems you dive too deep into it, it should be a very very simple to use package.

See also the example they delivered: https://github.com/meteor/mobile-packages/blob/master/examples/simple-photo/simple-photo.js

btw. we do use it in multiple apps without any issues.

Thanks for your responses.

I think there’s a miscommunication here. The error happens before the callback is even evaluated. This is because the underlying cordova extension of navigator is entirely undefined. Namely, navigator does not have a camera field (navigator.camera === undefined). This is very strange – it seems the package itself is not modifying the

The double click should not be an issue because they are in an {{#if}} {{else}} block, meaning it is impossible to click both at the same time.

I think I’ve tried it with a callback, but the same thing happens since the issue is deeper than that. I’ll check it over again, though, with your comments in mind, maybe I missed something silly.

1 Like

I would love to know your versions (meteor version, and package.json file for mdg:camera or the cordova camera plugin version) on the apps which it’s working on. Maybe I have version mismatches somewhere, which is causing the Cordova script to not load.

Try to build this one: https://github.com/meteor/mobile-packages/tree/master/examples/simple-photo

At first you should just update to most recent version. That is the first thing to try.

As requested in the first post it’s almost impossible to see what you did wrong if you don’t upload a code example. Create a new meteor app, paste in your camera code and put it to github. Then it’s easy to test with it.

1 Like

Thanks for your responses, they definitely helped! I decided to try the simple-photo project, and it worked. I then realized that it worked because I pulled the entire repository, including the packages file.

I was doing a ghost deployment in an empty directory, pulling the source from a deployed meteor app using --mobile-server. I wasn’t specifying a packages file, so the ObjC/Swift plugin for the Camera was not present in the XCode project. I specified my packages file, and it works as expected, now.

good you found it!

Meteor works best if you do not play around with the config. Just use it as intended.