In the last article we have discussed the Flags and the LocalFileSystem in PhoneGap. To read a file, we require a FileReader object. TheFileReader object is a way to read a file from the device's FileSystem. A file can be read as text, or as a Base64-encoded data string.

This object has the following properties.

This object has the following methods:

abort

By using the abort() method, we can stop reading a file from the FileSystem as shown in the following code:

function success(file) {
var reader_file = new FileReader();
reader_file.onloadend = function (event) {
alert("read success");
alert(event.target.result);
};
reader_file.readAsText(file);
reader_file.abort();
}
function fail(error) {
console.log(error.code);
}
entry.file(success, fail);

readAsDataUrl.

Using the readAsDataUrl() method, we can read a file and return the data as Base64-encoded data, which is ideal for images and other binary files as shown in the following code:

function success(file) {
var file_reader = new FileReader();
file_reader .onloadend = function(evt) {
alert("read success");
alert(evt.target.result);
};
file_reader .readAsDataURL(file);
}
function fail(evt) {
console.log(error.code);
}
entry.file(success, fail);

ReadAsText

By using the ReadAsText() method, we can also read a file and return text, which is most suitable for TXT file as shown in the following code:

function success(file) {
var file_reader = new FileReader();
file_reader .onloadend = function(evt) {
alert("read success");
alert(evt.target.result);
};
file_reader .readAsDataURL(file);
}
function fail(evt) {
console.log(error.code);
}
entry.file(success, fail);

FULL EXAMPLE

<!DOCTYPE html>
<html>
<head>
<title>FileReader Example</title>
<script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
<script type="text/javascript" charset="utf-8">

// Wait for PhoneGap to load
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}

// PhoneGap is ready
//
function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function gotFS(fileSystem) {
 fileSystem.root.getFile("readme.txt", null, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
fileEntry.file(gotFile, fail);
}
function gotFile(file){
readDataUrl(file);
readAsText(file);
}
function readAsDataURL(file) {
var file_reader = new FileReader();
file_reader.onloadend = function (evt) {
console.log("Read as data URL");
console.log(evt.target.result);
};
file_reader.readAsDataURL(file);
}
function readAsText(file) {
var file_reader = new FileReader();
file_reader.onloadend = function (evt) {
console.log("Read as text");

console.log(evt.target.result);
};
file_reader.readAsText(file);
}
function fail(evt) {
console.log(evt.target.error.code);
}
</script>
</head>
<body>
<h1>Example</h1>
<p>Read File</p>
</body>
</html>

Supported Platform:

Resources:

some of the useful resources are:

Using Flags and LocalFileSystem in PhoneGap
Working With Networks in Windows Phone 7 Using PhoneGap
Media in PhoneGap
Events in PhoneGap