FileReader & FileWriter issues (cordova 2.0.0 js) - javascript

I've been working on this bit of PhoneGap (cordova-2.0.0.js) code for an Android* device to persist some data. I'm getting this weird error code and the file doesn't seem to be getting written. I started with the example code and could write an inline string to a file handle successfully, so I'm sure my permissions and all are correct.
Perhaps I'm not handling all the callbacks correctly? There are a lot to listen for! It could be something with truncate(0); I had a hard time finding much documentation on it. Do I need to call window.requestFileSystem more than once? I do it 2x to register different callbacks. If not this, what is causing the error?
Suggestions on reducing the total number of lines for a Read + Write operation will be gladly accepted as well...
*Emulator running Android 2.3.4
here's my code:
var CREDENTIALS_FILE_NAME = "credentials.json";
var credentials;
// INIT -- Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, initCredentialReader, fail);
}
function initCredentialReader(fileSystem) {
fileSystem.root.getFile(CREDENTIALS_FILE_NAME, {create: true}, gotFileEntryReader, fail);
}
function gotFileEntryReader(fileEntry) {
fileEntry.file(gotFileToRead, fail);
}
function gotFileToRead(file){
var reader = new FileReader();
reader.onloadend = function(e) {
console.log("--FILE READER: "+e.target.result);
if( e.target.result.length < 1 ) {
credentials = newCredentials();
} else {
credentials = JSON.parse( e.target.result );
}
};
reader.readAsText(file);
}
// END CHAIN
function initCredentialWriter(fileSystem) {
fileSystem.root.getFile(CREDENTIALS_FILE_NAME, {create: true}, gotFileEntryWriter, fail);
}
function gotFileEntryWriter(fileEntry) {
fileEntry.createWriter(gotFileWriter, fail);
}
function gotFileWriter(writer) {
writer.onwrite = function(e) {
console.log("--- write success");
};
var toWrite = JSON.stringify(credentials);
console.log("--- toWrite: "+toWrite);
writer.truncate(0);
writer.seek(0);
writer.write(toWrite);
}
function fail(error) {
console.log("--- write FAIL: "+error.code);
}
function newCredentials() {
console.log("returning newCredentials!");
return {
"username" : "",
"password" : "",
"organization" : "",
"cookieValue" : "" };
}
function getCredentials() {
console.log("--- getCredentials: "+credentials);
return credentials;
}
function saveCredentials( jsonCredentials ) {
console.log('--- saveCredentials jsonCredentials: '+ jsonCredentials);
credentials = JSON.stringify( jsonCredentials );
console.log('--- credentials to save: '+credentials)
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, initCredentialWriter, fail);
return credentials;
}
ERROR
08-14 18:41:38.839: I/Web Console(2678): Error in success callback:
File9 =
{"code":7,"line":2863,"expressionBeginOffset":91407,"expressionEndOffset":91455,"sourceId":4122528,"sourceURL":"file:///android_asset/www/cordova-2.0.0.js"}
at file:///android_asset/www/cordova-2.0.0.js:258

So, turns out that calling truncate() and write() is not asynchronously correct-- just had implement more callbacks, like so:
function initCredentialTruncate(fileSystem) {
fileSystem.root.getFile(CREDENTIALS_FILE_NAME, {create: true}, gotFileEntryTruncate, fail);
}
function gotFileEntryTruncate(fileEntry) {
fileEntry.createWriter(gotFileTruncate, fail);
}
function gotFileTruncate(writer) {
writer.onwrite = function(e) {
console.log("--- truncate success");
};
writer.truncate(0);
//writer.seek(0);
}
// END CHAIN
and call the init function when necessary. thx for letting me vent, StackOverflow...

Related

how to create or write a file in android on phonegap?

I am using below code to write a file on android using PhoneGap, I think that this line window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fs) { is giving the error, can't find the exact error, just because I can't debug on android.
I find PhoneGap documentation confusing.
function download_file(cur_filename)
{
alert(5);
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fs) {
alert(2);
console.log('file system open: ' + fs.name);
alert(3);
fs.root.getFile(cur_filename, { create: true, exclusive: false }, function (fileEntry) {
alert("fileEntry is file?" + fileEntry.isFile.toString());
// fileEntry.name == 'someFile.txt'
fileEntry.name==cur_filename;
// fileEntry.fullPath == '/someFile.txt'
writeFile(fileEntry, null);
}, onErrorCreateFile);
}, onErrorLoadFs);
}
function writeFile(fileEntry, dataObj) {
aler(4);
// Create a FileWriter object for our FileEntry (log.txt).
fileEntry.createWriter(function (fileWriter) {
fileWriter.onwriteend = function() {
console.log("Successful file write...");
readFile(fileEntry);
};
fileWriter.onerror = function (e) {
console.log("Failed file write: " + e.toString());
};
// If data object is not passed in,
// create a new Blob instead.
if (!dataObj) {
dataObj = new Blob(['some file data'], { type: 'text/plain' });
}
fileWriter.write(dataObj);
});
}
Firstly, you can directly download the file rather than having to create and write a new one. You need to first install the following plugins
cordova plugin add cordova-plugin-file
cordova plugin add cordova-plugin-file-transfer
Now, you need to enclose the below logic inside deviceready event in case you are accessing plugins on app launch. The file-transfer ships with a download() that you need to use for downloading your file. Please find a sample code below
document.addEventListener("deviceready", startDownload, false);
function startDownload() {
var fileTransfer = new FileTransfer();
// replace uri with -> http://192.168.43.54/text.csv
var uri = encodeURI("https://file-examples.com/wp-content/uploads/2017/04/file_example_MP4_1920_18MG.mp4");
fileTransfer.download(
uri,
cordova.file.dataDirectory + 'videos/big_buck_bunny_720p_1mb.mp4',
function(entry) {
console.log("download complete: ", entry);
},
function(error) {
console.log("download error source " + error.source);
console.log("download error target " + error.target);
console.log("download error code" + error.code);
}
);
}
Once the download is completed, the entry object will have a nativeURL property that holds the local URL to the file.
More info
File Plugin
File-Transfer Download

Image File Download issue in ionic for iOS platform

I am trying to download some image files and store it for offline accessibility purpose of the app using Ionic framework. I have used two Cordova plugins named "Cordova-plugin-file" and "Cordova-plugin-file transfer". My code works on Android but faces a strange issue in iOS platform.
Error in Success callbackId: FileTransfer552364304 : TypeError: null
is not an object (evaluating 'result.lengthComputable'),
callbackFromNativecordova.js
Sometimes the code works, sometimes it throws me this error. Also I cannot access the error from my javascript code. Can anyone help? The code snippet is given below:
downloadImage: function(url, fileName) {
var deferred = $q.defer();
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fs) {
fs.root.getDirectory(
LOCAL_STORAGE_KEYS.app, {
create: true
},
function(dirEntry) {
// console.log(arguments);
dirEntry.getFile(
fileName, {
create: true,
exclusive: false
},
function(fe) {
console.log(arguments);
var p = fe.toURL();
console.log("In service the url path:", p);
fe.remove();
var ft = new FileTransfer();
console.log('File Transfer instance:',ft);
ft.download(
encodeURI(url),
p,
function(entry) {
console.log('In service the entry callback:',entry);
if (entry && entry.toURL) {
deferred.resolve(entry.toURL());
} else {
deferred.resolve();
}
},
function(err) {
console.log('Getting rejected:',err);
deferred.reject(err);
},
false,
null
);
},
function() {
deferred.reject(new Error('get file failed'));
}
);
}
);
},
function() {
deferred.reject(new Error('get directory failed'));
});
return deferred.promise;
}

phonegap deleting a file within a sub folder

I want to deleate a file in phonegap android application.
file is exists in subfolder.
I am finding a sample code on the internet.But I can't see.
Phonegap docs
is not enough for me.Can someone answer me how to delete a file within a subfolder.
function deleteFilelists(tx,results)
{
var fileName = "cdvfile://localhost/persistent//flower.jpg"
removefile(fileName);
function removefile(fileName){
fileSystem.root.getFile(fileName, {create: false, exclusive: false}, gotRemoveFileEntry, fail);
}
function gotRemoveFileEntry(fileEntry){
fileEntry.remove(success, fail);
}
function success(entry) {
alert("Removal succeeded");
}
function fail(error) {
alert("Error removing file: " + error.code);
}
}

Persistent storage in Phonegap

I have literally spent the last 6 hours trying to persist data using phonegap, my first approach was using the localStorate API but that was killed everytime the app restarted so it was useless. Now I implemented it by writing a file to the the filesystem, but with the following problems:
The file is created ok
The file has the corrent content doing adb pull /data/data/[package name]/friends.txt) I can see the content of the file
But trying to read from it I always get NULL.
This is my code if anyone can help me... I am out of ideas now :(
var friends = [];
// Initialize the Facebook SDK
document.addEventListener('deviceready', function() {
FB.init({
appId: '[myAppID]',
nativeInterface: CDV.FB,
useCachedDialogs: false
});
// Check if we already fetched our friends
readSavedContent();
});
function readSavedContent() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFileSystemForRead, fail);
}
function gotFileSystemForRead(fileSystem) {
fileSystem.root.getFile("friends.txt", {create: true, exclusive: false}, gotFileEntryForRead, fail);
}
function gotFileSystemForWrite(fileSystem) {
fileSystem.root.getFile("friends.txt", {create: true, exclusive: false}, gotFileEntryForWrite, fail);
}
function gotFileEntryForRead(fileEntry) {
var reader = new FileReader();
reader.onloadend = function(evt) {
alert("Data stored is " + evt.target.result);
};
reader.readAsText(fileEntry);
}
function gotFileEntryForWrite(fileEntry) {
fileEntry.createWriter(gotFileWriter, fail);
}
function gotFileWriter(writer) {
writer.onwriteend = function(evt) {
// show a message
alert(friends.length + " friends fetched, you should be able to see them if you restart the app");
};
writer.write(JSON.stringify(friends));
}
function fail(error) {
console.log(error.code);
alert(error);
}
function login() {
FB.login(function (response) {
console.log(JSON.stringify(response));
if (response.status === "connected") {
alert("logged in: fetching friends now");
// Fetch my friends
FB.api("/fql?q=" + encodeURIComponent('SELECT uid, first_name, last_name, email, pic, pic_big, is_app_user, devices FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1= me()) ORDER BY first_name LIMIT 2000'),
function(response) {
friends = response.data;
// Store the data to the disk
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFileSystemForWrite, fail);
}
);
} else {
alert('not logged in');
}
}, {
scope: "email"
});
}
From what I can see you have forgotten one step during the file read operation.
In your case you have this order:
function gotFileSystemForRead(fileSystem) {
fileSystem.root.getFile("friends.txt", {create: true, exclusive: false}, gotFileEntryForRead, fail);
}
function gotFileEntryForRead(fileEntry) {
var reader = new FileReader();
reader.onloadend = function(evt) {
alert("Data stored is " + evt.target.result);
};
reader.readAsText(fileEntry);
}
When it should look like this:
function gotFileSystemForRead(fileSystem) {
fileSystem.root.getFile("friends.txt", {create: true, exclusive: false}, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
fileEntry.file(gotFileEntryForRead, fail);
}
function gotFileEntryForRead(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
alert("Data stored is " + evt.target.result);
};
reader.readAsText(file);
}
To find out more take a look at this official Phonegape FileReader documentation.
Then again you can always abandon this solution and use a persistance js for data storage. It will provide you 4+1 different options for file/data storage and it works on numerous platforms.
As a side note, localstorage persistence was bugged in cordova(phonegap) version 2.6, so if this is your case, try migrating to cordova 2.7 recently released or downgrade to 2.5 to get rid of said bug.

Phonegap in Android onDeviceReady function

I am using phonegap in android development. I wrote that PoC, however I can not figure out why it does not change the latitude of profile variable. Actually
alert(profile.latitude);
runs before the
geoCode.setLocation();
here is my code;
document.addEventListener("deviceready", onDeviceReady, false);
var profile = {
name: "",
id: "red",
latitude: "xx",
longtitude: "",
setCoordinates: function (latit, longt) {
this.latitude = latit;
this.longtitude = longt;
}
};
var geoCode = {
onSuccess: function (position) {
profile.latitude = position.coords.latitude;
},
onError: function (error) {
},
setLocation : function () {
navigator.geolocation.getCurrentPosition(this.onSuccess, this.onError);
}
};
// Wait for PhoneGap to load
//
function onDeviceReady() {
geoCode.setLocation();
//alert("2");
alert(profile.latitude);
};
thanks in advance
navigator.geolocation.getCurrentPosition is an asynchronous function. You need to do something like :
var geoCode = {
setLocation : function (callback) {
onSuccess: function (position) {
callback(position.coords.latitude);
},
onError: function (error) {
},
navigator.geolocation.getCurrentPosition(onSuccess, onError);
}
};
// Wait for PhoneGap to load
//
function onDeviceReady() {
geoCode.setLocation(function(latitude) {
alert(latitude);
});
};
Quite simply it is because the call to navigator.geolocation.getCurrentPosition() is an asynchronous call. Thereby the execution of the program continues and you see the alert. Sometime after the alert is show the onSuccess call of your geoCode class is called updating the profile.latitude value.

Categories

Resources