Get file content of a ImageUri

Question

I would like to update an image taken from my phone to Parse, we are struggling with this simple feature since we cannot convert our ImageUri to a real file with Phonegap (in order to upload it to our Parse server), We are using Ripple to emulate the phone behaviour.

We have try with this piece of code:

var reader = new FileReader();


reader.onloadend = function(evt) {

console.log("read success");
console.log(evt.target.result);
evt.target.result;
};
reader.readAsText(user.myPicture);

But i get this error: TypeError: Object #<Console> has no method 'warning'

Seems like FileReader of phonegap does not like the kind of URI that I get from navigator.camera.getPicture()

$scope.getPicture = function(){

            navigator.camera.getPicture(onSuccess, onFail,
                //Options => http://docs.phonegap.com/en/2.6.0/cordova_camera_camera.md.html#Camera
                { quality: 50,
                    destinationType:Camera.DestinationType.FILE_URI,
                    encodingType: Camera.EncodingType.JPEG,
                    sourceType : Camera.PictureSourceType.PHOTOLIBRARY ,//CAMERA,
                    targetWidth: 100,
                    targetHeight: 100
                });
            function onSuccess(imageURI) {
                var image = document.getElementById('preview');
                image.src = imageURI;
                $scope.myPicture = image.src;

//                $scope.$apply(function() {
//                    ctrl.$setViewValue(image.src);
//                });
            }

            function onFail(message) {
                alert('Failed because: ' + message);
                ctrl.$setValidity('Failed because: ' + message, false);
            }

        };

Is there any other way in to get the File without using JQuery $.get()?

There is a similar post here that has the same problem

score 3 · Accepted Answer · answered Jul 11 '13 at 14:33

I think you will appreciate the same answer I got for my question you linked.

with the info in this post. . Big thanks to Raymond Camden!

function gotPic(data) {

window.resolveLocalFileSystemURI(data, function(entry) {

var reader = new FileReader();

reader.onloadend = function(evt) {
    var byteArray = new Uint8Array(evt.target.result);
    var output = new Array( byteArray.length );
    var i = 0;
    var n = output.length;
    while( i < n ) {
        output[i] = byteArray[i];
        i++;
    }                
    var parseFile = new Parse.File("mypic.jpg", output);

    parseFile.save().then(function(ob) {
            navigator.notification.alert("Got it!", null);
            console.log(JSON.stringify(ob));
        }, function(error) {
            console.log("Error");
            console.log(error);
        });

}

reader.onerror = function(evt) {
      console.log('read error');
      console.log(JSON.stringify(evt));
  }

entry.file(function(s) {
    reader.readAsArrayBuffer(s);
}, function(e) {
    console.log('ee');
});

});
}

score 0 · Answer 2 · edited May 23 '17 at 12:23

0

I'm not sure to understand. You want to save the picture, or just display it, or something else ?

To save the picture, someone has written a plugin. You can find it here : base64ToPNG
To display the picture :

image.src = "data:image/jpeg;base64," + imageURI

edited May 23 '17 at 12:23

Community

1
1

answered May 15 '13 at 15:22

gaepi

404
3
14

Get file content of a ImageUri

2 Answers2