[SOLVED] Camera is not defined when using $cordovaCamera

eno · November 20, 2014, 7:26pm

We are using ngCordova and I have $cordovaCamera injected into my method. I get errors when using the Camera object in my camera options:

    // select an existing picture
    $scope.selectPicture = function($cordovaCamera) {
            var options = { 
                    //quality : 75, 
                    destinationType : Camera.DestinationType.DATA_URL, 
                    sourceType : Camera.PictureSourceType.PHOTOLIBRARY, 
                    allowEdit : true,
                    encodingType: Camera.EncodingType.JPEG,
                    //targetWidth: 100,
                    //targetHeight: 100,
                    popoverOptions: CameraPopoverOptions,
                            saveToPhotoAlbum: false
            };
        $cordovaCamera.getPicture(options).then(function(imageData) {
                    // success image data is here
                    }, function(err) {
                            // An error occured. Show a message to the user
            });
    };

The error Im seeing is:

ReferenceError: Camera is not defined
at Scope.$scope.takePicture (file:///android_asset/www/js/controllers.js:272:22)
at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:18471:21
at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:43026:9
at Scope.$eval (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20326:28)
at Scope.$apply (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20424:23)
at HTMLAnchorElement. (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:43025:13)
at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:10478:10
at forEach (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:7950:18)
at HTMLAnchorElement.eventHandler (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:10477:5)
at triggerMouseEvent (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:2648:7)

Line 272 is the first line of options in the code fragment up top.

nicraboy · November 20, 2014, 10:01pm

Hi @eno,

Make sure you try to access the camera only after the $ionicPlatform.ready() or onDeviceReady() has triggered. Many plugins are not loaded instantly which believe you’re suffering from.

Let me know if this works.

Regards,

eno · November 20, 2014, 11:07pm

The problem was that the actual plugin never made it into the actual Android build even though it had been installed and existed in my plugins folder. Furthermore, telling cordova to install again doesn’t work. I had to remove my platforms, remove the plugin, reinstall the plugin, re-add my platform (I have a hooks script that fires after platform add that installs all the plugins we use). Only after all, my Android build actually worked.

p8queiroz · October 18, 2015, 11:38pm

I had a similar problem with code similar to yours. The problem was solved only after I updated my phone. I was disappointed for not getting the method getPicture() working and I give up on trying to fix this bug for like 1 week. Then, my cellphone (android) was updated and right after the update process I checked the app and it was working.

I have to mention that I almost throw my cellphone away --’

rikkie · October 19, 2015, 7:07am

I’m still having a problem with wp8.1, firtst i got this error to,but now the camera shows up when i tab to make a picture i hear a clicking sound like the picture is taken but after that nothing happens and the only thing i can do is cancel the camera

p8queiroz · October 20, 2015, 5:06pm

Rikkie,

I want to make sure that that you tried this. I’ve just faced the 'Camera is not defined ’ again:

“refresh” the camera plugin by typing (android/ios - up to you)

cordova plugin rm cordova-plugin-camera
ionic platform rm android
ionic platform add android
cordova plugin add cordova-plugin-camera

I am running the app in a real device, I am using chrome console to debug and type ‘window.cordova’ or even ‘Camera’ on chrome’s console and the result was undefined which means that cordova wasn’t loaded correctly.

Then I’ve noticed that in my index.html I removed the call to:

<script src="cordova.js"></script>

I’ve just added the piece of code above and now my code is like this:

<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>

Things are working properly.

Please let us know if you have succeded!

dimitri320 · December 24, 2016, 4:30pm

I’ve tried to do what was advices, and this didn’t help me at all. When testing in a browser, I’m still getting the error: “ReferenceError: Camera is not defined”, and when testing on a device (iOS) the camera opens, takes a photo and doesn’t add it to the App nor Firebase. I also don’t know how to debug it from that point onwards. So I can’t tell weather the problem is with Cordova or with the rest of my code that interfaces with Firebase. Any advice on how to debug?

Daviddiego · March 11, 2017, 12:09am

I’ve found same problem. I’ve solved by changing Camera object in the “options” definition by $cordovaCamera.

However, I can’t take a picture on my device. I’m using the creator app. Do you know if it should work from there?

    var op    tions = {
          quality: 50,
          destinationType: $cordovaCamera.DestinationType.DATA_URL,
          sourceType: $cordovaCamera.PictureSourceType.CAMERA,
          allowEdit: true,
          encodingType: $cordovaCamera.EncodingType.JPEG,
          targetWidth: 100,
          targetHeight: 100,
          popoverOptions: $cordovaCamera.PopoverArrowDirection.ARROW_UP,
          saveToPhotoAlbum: false,
    	  correctOrientation:true
        };

jav_bk201 · May 5, 2017, 7:39pm

Hi! I’ve same problem. Browser’s console show me same error and i thought this was due by service, it mean, i create a service that contain “Camera” (Here code):
.service(‘Camera’, function($q) {

return {
getPicture: function(options) {
var q = $q.defer();

     $cordovaCamera.getPicture(function(result) {
        q.resolve(result);
     }, function(err) {
        q.reject(err);
     }, options);

     return q.promise;

But now show another error “Error: Camera.DestinationType is undefined”. I need help with that

AhmetCetin · April 7, 2019, 1:02pm

Hey,

I had similar problem. However i solved problem with following this solution.

plugins - Camera.getPicture is not a function in ionic 3 - Stack Overflow