Upload image to server with ionic/angularjs - angularjs

Question

I want upload image to server with ionic.
I use this factory:
(function () {
function ius($q, $ionicLoading, $cordovaFile ) {
var service = {};
service.uploadImage = uploadImage;
return service;
function uploadImage(imageURI) {
var deferred = $q.defer();
var fileSize;
var percentage;
// Find out how big the original file is
window.resolveLocalFileSystemURL(imageURI, function (fileEntry) {
fileEntry.file(function (fileObj) {
fileSize = fileObj.size;
// Display a loading indicator reporting the start of the upload
$ionicLoading.show({ template: 'Uploading Picture : ' + 0 + '%' });
// Trigger the upload
uploadFile();
});
});
function uploadFile() {
// Add the Cloudinary "upload preset" name to the headers
var uploadOptions = {
params: { 'upload_preset': CLOUDINARY_CONFIGS.UPLOAD_PRESET } //CLOUDINARY_CONFIGS.UPLOAD_PRESET
};
$cordovaFile
// Your Cloudinary URL will go here
.uploadFile(CLOUDINARY_CONFIGS.API_URL, imageURI, uploadOptions) //
.then(function (result) {
// Let the user know the upload is completed
$ionicLoading.show({ template: 'Upload Completed', duration: 1000 });
// Result has a "response" property that is escaped
// FYI: The result will also have URLs for any new images generated with
// eager transformations
var response = JSON.parse(decodeURIComponent(result.response));
deferred.resolve(response);
}, function (err) {
// Uh oh!
$ionicLoading.show({ template: 'Upload Failed', duration: 3000 });
deferred.reject(err);
}, function (progress) {
// The upload plugin gives you information about how much data has been transferred
// on some interval. Use this with the original file size to show a progress indicator.
percentage = Math.floor(progress.loaded / fileSize * 100);
$ionicLoading.show({ template: 'Uploading Picture : ' + percentage + '%' });
});
}
return deferred.promise;
}
}
angular.module('App').factory('ImageUploadService', ius);
})();
And i call this function :
'Use Strict';
angular.module('App').controller('editeventController', function ($scope,ImageUploadService) {
$scope.upload = function () {
ImageUploadService.uploadImage("img/test.jpg").then(
function (result) {
var url = result.secure_url || '';
var urlSmall;
if (result && result.eager[0]) urlSmall = result.eager[0].secure_url || '';
// Do something with the results here.
$cordovaCamera.cleanup();
},
function (err) {
// Do something with the error here
$cordovaCamera.cleanup();
});
}
But, when I try to upload, I have this error:
TypeError: window.resolveLocalFileSystemURL is not a function
at Object.uploadImage (http://localhost:8100/js/services/utils.js:177:20)
at Scope.$scope.upload (http://localhost:8100/views/editevent/editevent.js:199:28)
at fn (eval at (http://localhost:8100/lib/ionic/js/ionic.bundle.js:26457:15),
:4:209)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:62386:9
at Scope.$eval (http://localhost:8100/lib/ionic/js/ionic.bundle.js:29158:28)
at Scope.$apply (http://localhost:8100/lib/ionic/js/ionic.bundle.js:29257:23)
at HTMLButtonElement. (http://localhost:8100/lib/ionic/js/ionic.bundle.js:62385:13)
at HTMLButtonElement.eventHandler (http://localhost:8100/lib/ionic/js/ionic.bundle.js:16583:21)
at triggerMouseEvent (http://localhost:8100/lib/ionic/js/ionic.bundle.js:2948:7)
at tapClick (http://localhost:8100/lib/ionic/js/ionic.bundle.js:2937:3)
[edit]
I use requestFileSystem instead of resolveLocalFileSystemURL
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(window.PERSISTENT, 0, onSuccess, onError);
function onSuccess(fileSystem) {
var directoryEntry = fileSystem.root;
console.log(directoryEntry);
directoryEntry.getFile(imageURI, { create: true, exclusive: false }, function (fileEntry) {
console.log(fileEntry);
fileEntry.createWriter(function (writer) {
// writer.write("This is the text inside readme file");
var pathOfFile = fileEntry.fullPath;
console.log(pathOfFile);
fileSize = fileEntry.size;
// Display a loading indicator reporting the start of the upload
$ionicLoading.show({ template: 'Uploading Picture : ' + 0 + '%' });
uploadFile();
}, function (error) {
alert("Error occurred while writing to file. Error is: " + error.message);
});
}, function (error) {
console.log(error.message);
alert("Error occurred while getting a pointer to file. Error is: " + error.message);
});
}
function onError(evt) {
alert("Error occurred during request to file system pointer. Error is: " + evt.message);
}
Now I have this error:
The operation failed because it would cause the application to exceed
its storage quota.