Good day, i have a project on cordova that uses image gallery and camera and stores images in local cache folder.
So i installed:
org.apache.cordova.camera 0.3.1 "Camera"
org.apache.cordova.file 1.3.1 "File"
org.apache.cordova.file-transfer 0.4.6 "File Transfer"
Android and iOS works perfectly, but when it comes to WP8 (Windows Phone 8), following code:
$scope.uploadImageFromPhone = function(isCamera){
console.log('uploadImageFromPhone');
var opt = {
quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
sourceType: (isCamera) ? Camera.PictureSourceType.CAMERA : Camera.PictureSourceType.PHOTOLIBRARY,
encodingType: Camera.EncodingType.JPEG
};
function onGetImageSuccess(fileUrl) {
console.log('onGetImageSuccess:\n'+fileUrl);
window.resolveLocalFileSystemURL(fileUrl, resolveSuccess, resolveFails);
}
function onGetImageFail(message) {
//console.log('onGetImageFailed:\n' + JSON.stringify(message));
}
function resolveSuccess (path) {
console.log('resolveSuccess:');
console.log(JSON.stringify(path));
uri = path.nativeURL;
//wp8 returns null as path.nativeURL
/*IE10 specific hack*/
if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
uri = path.fullPath;
}
}
function resolveFails(err){
console.log('resolveFails:\n' + JSON.stringify(err));
};
navigator.camera.getPicture(onGetImageSuccess, onGetImageFail, opt);
}
The resolveSuccess function always returns path variable as shown below:
{"isFile":true,"isDirectory":false,"name":"wp_ss_20140923_0001.png","fullPath":"///CapturedImagesCache/wp_ss_20140923_0001.png","filesystem":"<FileSystem: temporary>","nativeURL":null}
Problem is that nativeURL is null.
According to my app, chosen file must be put in application local cache, so i try to download it and store in cache by approaching to fullPath with file-transfer plugin:
var fileTransfer = new FileTransfer();
fileTransfer.download(
uri, // equals to '///CapturedImagesCache/wp_ss_20140923_0001.png'
'wp_ss_20140923_0001.png',
function(entry){
//file processing
console.log('downloaded successfull');
},
function(error){
console.log("download error" + JSON.stringify(error));
},
false,
{}
);
This code always returns me console output:
download error: {"code":2,"source":"///CapturedImagesCache/wp_ss_20140923_0001.png","target":null,"http_status":null,"body":null,"exception":null}
I don't get it, what am i doing wrong here?
P.S: cordova version: '3.6.3-0.2.13'
Related
I am using a node s3 client (https://github.com/andrewrk/node-s3-client#clientdownloaddirparams) to sync an entire directory from S3 to a local directory.
As per the documentation, my code is as follows:
var s3 = require('s3');
var client = s3.createClient({
s3Options: {
accessKeyId: Config.accessKeyId,
secretAccessKey: Config.secretAccessKey
}
});
var downloader = client.downloadDir({
localDir: 'images/assets',
deleteRemoved: true,
s3Params: {
Bucket: Config.bucket,
Prefix: Config.bucketFolder
}
});
downloader.on('error', function(err) {
console.error("unable to download: ", err);
});
downloader.on('progress', function() {
console.log("progress", downloader.progressMd5Amount, downloader.progressAmount, downloader.progressTotal);
});
downloader.on('end', function(data) {
console.log("done downloading", data);
});
This begins syncing and the folder begins downloading, but eventually returns this:
progress 0 0 0
...
progress 1740297 225583 5150000
unable to download: { Error: EISDIR: illegal operation on a directory, open 'images/assets'
at Error (native)
errno: -21,
code: 'EISDIR',
syscall: 'open',
path: 'images/assets' }
The directory does indeed exist. I've tried moving directory location, path, etc, but nothing seems to do the trick. I have researched this error and have found out that it occurs when you try to open a file, but the path given is a directory. Not sure why this s3-client is trying to open a file instead of a directory. Any help or advice would be awesome. Thanks!
I just determined that download speeds were causing this issue. Unfortunately, I was on a network with .5 up and down. I just switched over to 25/10 and its working fine.
Remember that in S3, you can create a directory that has the same name as a file. Based on the error you're getting, I would say that in S3 you have a file named images and a folder named images. This would be illegal on the file system but not in S3.
Use getS3Params function to resolve this :
getS3Params: function getS3Params(localFile, s3Object, callback) {
if (path.extname(localFile) === '') { callback(null, null); }
else { callback(null, {}); }
}
https://github.com/andrewrk/node-s3-client/issues/80
Ho to everyone. I followed this tutorial to create a modal view with a pdf generated with pdfmake.
http://gonehybrid.com/how-to-create-and-display-a-pdf-file-in-your-ionic-app/
My simply question is how can i save the pdf in my local storage on in cache? I need that to send the pdf by email or open it with openfile2. I'm using Ionic and cordova.
I don't know how you code it, but I know what plugin you should use:
https://github.com/apache/cordova-plugin-file
The git contains a complete documentation of the plugin so everything you could need should be there.
Sample code to write pdf file in device using cordova file and file transfer plugin:
var fileTransfer = new FileTransfer();
if (sessionStorage.platform.toLowerCase() == "android") {
window.resolveLocalFileSystemURL(cordova.file.externalRootDirectory, onFileSystemSuccess, onError);
} else {
// for iOS
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, onError);
}
function onError(e) {
navigator.notification.alert("Error : Downloading Failed");
};
function onFileSystemSuccess(fileSystem) {
var entry = "";
if (sessionStorage.platform.toLowerCase() == "android") {
entry = fileSystem;
} else {
entry = fileSystem.root;
}
entry.getDirectory("Cordova", {
create: true,
exclusive: false
}, onGetDirectorySuccess, onGetDirectoryFail);
};
function onGetDirectorySuccess(dir) {
cdr = dir;
dir.getFile(filename, {
create: true,
exclusive: false
}, gotFileEntry, errorHandler);
};
function gotFileEntry(fileEntry) {
// URL in which the pdf is available
var documentUrl = "http://localhost:8080/testapp/test.pdf";
var uri = encodeURI(documentUrl);
fileTransfer.download(uri, cdr.nativeURL + "test.pdf",
function(entry) {
// Logic to open file using file opener plugin
},
function(error) {
navigator.notification.alert(ajaxErrorMsg);
},
false
);
};
I am trying to save an image captured using cordova camera plugin to a specific directory for windows 8.1 application. But I am not able to find an exact solution for this. I have gone through many questions and forums, no luck.
Here is a sample code I have tried.
onTakePhoto: function () {
navigator.camera.getPicture(this.onPhotoSuccess, this.onPhotoFail, {
quality: 100,
destinationType: Camera.DestinationType.FILE_URI,
encodingType: Camera.EncodingType.JPEG,
sourceType: Camera.PictureSourceType.CAMERA,
saveToPhotoAlbum: false
});
},
//Callback function if onTakePhoto action is success.
onPhotoSuccess: function (oImageURI) {
console.log("In Success " + oImageURI);
window.resolveLocalFileSystemURI(oImageURI, this.handlePicSave, this.onPhotoFail);
},
//Callback function if onTakePhoto action fails
onPhotoFail: function (oError) {
console.log("In Fail " + oError);
},
//Handle pic save
handlePicSave: function(oEntry) {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fileSys) {
fileSys.root.getDirectory("MyPhotos", { create: true, exclusive: false }, function (directory) {
oEntry.moveTo(directory, "WO_2.jpg", that.successMove, that.onPhotoFail);
}, that.onPhotoFail);
},
that.onPhotoFail);
},
The above code works fine and saves the image to the app root folder i.e C:\Users\..\AppData\Local\Packages\App_name\LocalState\MyPhotos\WO_2.jpg
But I need to store directly to C drive like.. C:\MyPhotos\WO_2.jpg
I think you should check cordova file plugin, It allows to access differents folders and read / write. I do not use it for camera purposes, but I used it for saving files in diferent projects and works fine.
I am developing a mobile application and I getting an error when the user try to change the picture profile, the error after do a lot of debugging is not in the camera is in the file transfer function when I try to send the image to the server, there is no error code or message, simply the application stop work, this is the code:
$scope.addImage = function (option) {
var options = {
quality: 75,
targetWidth: 300,
destinationType: Camera.DestinationType.DATA_URL,
targetHeight: 300,
saveToPhotoAlbum: false,
correctOrientation: true
};
if (option == 1) {
options.sourceType = Camera.PictureSourceType.CAMERA;
} else {
options.sourceType = Camera.PictureSourceType.PHOTOLIBRARY;
}
$cordovaCamera.getPicture(options).then(function (imageData) {
console.log("IMAGE DATA");
console.log(imageData);
//alert("SUCCESS");
$scope.user.image = "data:image/jpeg;base64," + imageData;
console.log(JSON.stringify($scope.user));
$scope.savePicture();
}, function (err) {
alert("ERRROR");
alert(JSON.stringify(err));
// An error occured. Show a message to the user
});
};
$scope.savePicture = function () {
var options = {
fileKey: "avatar",
fileName: "image.jpg",
chunkedMode: false,
mimeType: "image/jpeg",
headers: {
Authorization: "Bearer " + $auth.getToken()
}
};
$cordovaFileTransfer.upload(api.getApi()+"user/updatephoto", $scope.user.image, options).then(function (result) {
console.log("SUCCESS: " + JSON.stringify(result.response));
}, function (err) {
console.log("ERROR: " + JSON.stringify(err));
alert("ERROR: " + JSON.stringify(err));
}, function (progress) {
// constant progress updates
});
};
Thank in advice for your help
you are not calling return appropriately on your functions that return a promise. From a quick review, $scope.savePicture(); should be return $scope.savePicture();
and $cordovaFileTransfer.upload() should also be return $cordovaFileTransfer.upload()
I would start there and see if you start to make some progress.
I had to debug the entire application including the cat log of android and I found the problem.
The problem was that I am using Ionic with crosswalk and the version of FileTransfer that I was using does not support crosswalk.
I fix this problem just installing the last version of file transfer:
cordova-plugin-file-transfer 1.2.1 "File Transfer"
This is probably simple and covered by some combination of functions in PhoneGap's "Camera" plugin, "File" plugin, or "File-Transfer" plugin. I understand the user can select a file with:
navigator.camera.getPicture(function (fileURI) {
// *** need help here ***
}, function ()
// handle errors
}, {
destinationType: window.Camera.DestinationType.FILE_URI,
sourceType: window.Camera.PictureSourceType.PHOTOLIBRARY,
mediaType: window.Camera.MediaType.ALLMEDIA
});
I can also change to destinationType: window.Camera.DestinationType.DATA_URL if that makes a difference.
My goal in the success handler is to get a File object (https://developer.mozilla.org/en-US/docs/Web/API/File).
Something like this should do it.
navigator.camera.getPicture(function (fileURI) {
window.resolveLocalFileSystemURL(fileURI,
function(fileEntry){
alert("got image file entry: " + fileEntry.fullPath);
// fileEntry.file() should return a raw HTML File Object
},
function(){//error}
);
}, function (){
// handle errors
}, {
destinationType: window.Camera.DestinationType.FILE_URI,
sourceType: window.Camera.PictureSourceType.PHOTOLIBRARY,
mediaType: window.Camera.MediaType.ALLMEDIA
});
window.resolveLocalFileSystemURI(fileURI, function(fileEntry) { /* your code here */ });