Phonegap camera.getPicture picurl not found after restart the App

Question

I have been developing an App with Phonegap.

I use the camera plugin. If I get a photo from the library over the plugin, I get the picurl. I save the url in localStorage and display the pic with html in the app. That works good.

After an app restart, I want to display the same pic again, but now the picurl is invalid. It is the same path like the first time, but now it is invalid.

Get Photo:

pictureSource = navigator.camera.PictureSourceType;
            destinationType = navigator.camera.DestinationType;
            navigator.camera.MediaType = 0;
            navigator.camera.getPicture(onPhotoURISuccess, onFail, {
                quality: 50,
                destinationType: destinationType.FILE_URI,
                mediaType: navigator.camera.MediaType.PICTURE,
                sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
            });
function onPhotoURISuccess(imageURI) {
            localStorage.pic = imageURI;
            $scope.$apply(function () {
                var html = '<img id="img1" src="' + imageURI + '" />';
                $scope.photogallery = html;
            }
            )
        }

For testing purposes, I added the picurl in my view:

<img ng-src="picurl" />

After the restart it is no pic in my view. If I watch it with the inspector in my browser, I see the right url. But it is invalid.

It seems that the plugin load the pic in a "tmp"-folder with a name like "cdv_photo_001.jpg" If i put the same pic from the library again, I get the same url in the "tmp"-folder with the file name "cdv_photo_002.jpg". Is there an option to get a persistent url on the device. Not a temporary folder with pics.

Please specify the plugin that you use and share some code, if you can share the error that show you the url invalid — phemt.latd, Jan 22 '15 at 09:16
If you use angular remember that img src atribute not work, you must use ng-src http://stackoverflow.com/q/18235169/1636209 — phemt.latd, Jan 22 '15 at 09:33
Ok. sry. But that is not important. I added more infos to my question. — alexander-fire, Jan 22 '15 at 09:46
Probably when the app restart it lose the picture because the temp folder is stashed. Check if after the appe restart the folder contains two file 001.jpg and 002.jpg. Or only 002.jpg, the most recent. — phemt.latd, Jan 22 '15 at 09:57
Yes. The problem is the temp folder. I will be cleared after restart. Is there an option to get the absolute path to the pic on the device. — alexander-fire, Jan 22 '15 at 09:58
I think that for security reasons cordova ( better, a WebView ) can't access the pictures file system...for this reason the plugin use a temp folder as a bridge — phemt.latd, Jan 22 '15 at 10:01
probably i find something usefull here: http://docs.phonegap.com/en/edge/cordova_camera_camera.md.html at the section **Android Quirks** — phemt.latd, Jan 22 '15 at 10:05

score 0 · Answer 1 · answered Jan 22 '15 at 10:47

Ok. The problem is, that the plugin get no access to the library. So the pics get into a tmp folder.

My solution now is to move the pic from the folder to a persistent filesystem.

var app = {
    capturePhoto: function () {
        if (!navigator.camera) {
            alert('Camera API not supported');
        }

        navigator.camera.getPicture( app.cameraSuccess, app.cameraError, {
            quality: 50,
            destinationType: Camera.DestinationType.FILE_URI
        });

    },

    cameraSuccess: function (imageData) {
        console.log('cameraSuccess: '+imageData);

        app.movePhoto( imageData );
    },

    movePhoto: function (file){
        alert(file);
        window.resolveLocalFileSystemURI( file , app.resolveOnSuccess, app.resOnError);
    },

    resolveOnSuccess: function (entry){
        var d = new Date();
        var n = d.getTime();

        //new file name
        var newFileName = n + ".jpg";
        var myFolderApp = "my_folder";

        window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {

                fileSys.root.getDirectory( myFolderApp,
                    {create:true},
                    function(directory) {
                        entry.moveTo(directory, newFileName, function(new_entry){
                            path = new_entry.fullPath;
                            url = new_entry.toURL();

                            console.log(path+"\n"+url);

                            alert( path+"\n"+url );

                            jQuery('body').append('<img src="'+path+'" />');

                        }, app.resOnError);
                    },
                    app.resOnError);
            },
            app.resOnError);
    },

    resOnError: function(error) {
        alert('Error '+error.code+': '+error.message);
    },
}

Phonegap camera.getPicture picurl not found after restart the App

1 Answers1