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.
Related
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
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;
}
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);
}
}
I am trying to save multiple files to a directory - in one operation. If I correctly understand the chrome fileSystem api documentation this should be possible when I use the openDirectory option for chrome.fileSystem.chooseEntry. Is that even allowed?
However, the documentation is very minimalistic and I also did not find any examples via google.
More background:
I have the proper permissions to access a directory and also have write permissions:
/*you need chrome >= Version 31.x [currently chrome beta]*/
"permissions": [
{"fileSystem": ["write", "directory"]}, "storage",
]
Then you are left with chrome.fileSystem.chooseEntry(object options, function callback) and chrome.fileSystem.getWritableEntry(entry entry, function callback), but I did not figure out if these functions are even what I want.
Here is how a single file can be saved to the file system:
chrome.fileSystem.chooseEntry({type:"saveFile", suggestedName:"image.jpg"},
function(entry, array){
save(entry, blob); /*the blob was provided earlier*/
}
);
function save(fileEntry, content) {
fileEntry.createWriter(function(fileWriter) {
fileWriter.onwriteend = function(e) {
fileWriter.onwriteend = null;
fileWriter.truncate(content.size);
};
fileWriter.onerror = function(e) {
console.log('Write failed: ' + e.toString());
};
var blob = new Blob([content], {'type': 'image/jpeg'});
fileWriter.write(blob);
}, errorHandler);
}
But how can I save multiple files when I use chrome.fileSystem.chooseEntry({type:"openDirectory",..} or does openDirectory only grant me read-rights?
I believe this should work.
chrome.fileSystem.chooseEntry({type:'openDirectory'}, function(entry) {
chrome.fileSystem.getWritableEntry(entry, function(entry) {
entry.getFile('file1.txt', {create:true}, function(entry) {
entry.createWriter(function(writer) {
writer.write(new Blob(['Lorem'], {type: 'text/plain'}));
});
});
entry.getFile('file2.txt', {create:true}, function(entry) {
entry.createWriter(function(writer) {
writer.write(new Blob(['Ipsum'], {type: 'text/plain'}));
});
});
});
});
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...