PhoneGap/Cordova Example - Getting File Metadata (and an update to the FAQ)

This post is more than 2 years old.

I decided to move my PhoneGap/Cordova FileSystem FAQ from a Google Doc to my Cordova Examples repository. I figured this would make it a bit easier for folks to edit and simpler for me to commit those changes. You can find the FAQ here:

PhoneGap Cordova File System FAQ

In doing so I decided to quickly knock out one of the questions - how to get metadata about files. This is rather trivial, so my demo app is rather trivial, but hopefully it will help folks. The basic gist is - once you have a FileEntry object, you can then fetch the File object itself (MDN Docs) and fetch various properties. Here is a super simple demo roughly based on the ones I showed earlier. It uses window.resolveLocalFileSystemURL to get index.html.

document.addEventListener("deviceready", init, false);
function init() {
	
	//This alias is a read-only pointer to the app itself
	window.resolveLocalFileSystemURL(cordova.file.applicationDirectory + "www/index.html", gotFile, fail);

}

function fail(e) {
	console.log("FileSystem Error");
	console.dir(e);
}

function gotFile(fileEntry) {

	fileEntry.file(function(file) {
		var s = "";
		s += "<b>name:</b> " + file.name + "<br/>";
		s += "<b>localURL:</b> " + file.localURL + "<br/>";
		s += "<b>type:</b> " + file.type + "<br/>";
		s += "<b>lastModifiedDate:</b> " + (new Date(file.lastModifiedDate)) + "<br/>";
		s += "<b>size:</b> " + file.size + "<br/>";
		
		document.querySelector("#status").innerHTML = s;
		console.dir(file);
	});
}

Here is a sample of it running in iOS. (Be aware - there is a bug with Android that may prevent this from working. It is reported at the Cordova site.)

So - yeah - not rocket science - but hopefully helpful. This "application" can be grabbed from my Cordova repo: https://github.com/cfjedimaster/Cordova-Examples/tree/master/getfiledata.

Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA https://www.raymondcamden.com

Archived Comments

Comment 1 by Giacomo Balli posted on 8/22/2014 at 8:20 PM

why is type showing up as _null_?
also, is this any better/easier then using AJAX and getting headers?

Comment 2 by Raymond Camden posted on 8/22/2014 at 8:24 PM

If I had to guess, it doesn't know what an html file is.

Is this better? Um... I don't know. :) I've been using files under www/ for my blog posts because it is easier to work with. I think generally folks will probably *not* be doing that. Does that make sense?

Comment 3 by Giacomo Balli posted on 8/22/2014 at 8:48 PM

Might make sense but not really getting it :)
Either way, I believe it's subjective (i.e. what you're used to)...

Comment 4 by Realtebo posted on 12/7/2015 at 11:27 AM

I've a problem with FileEntry properties. I've a FileEntry; it's ok because I can succesfully do a .remove() on it. But, before remove, obviously, if I print .lastModifiedDate or .size I got undefined as both value. Why?

Comment 5 (In reply to #4) by Raymond Camden posted on 12/7/2015 at 4:19 PM

Can you post a Gist to the code? It may be an async issue.

Comment 6 (In reply to #5) by Realtebo posted on 12/9/2015 at 1:43 PM

It was a my mistake: i forgot to call the .file() function. thanks for your reply and for your excellent tutorials.

Comment 7 by Torsten Feld posted on 1/10/2016 at 9:59 AM

Thank you for this article. You saved my day! :)

Comment 8 by Prashanth Kumar posted on 5/30/2016 at 4:41 AM

Why is type null, i need the mime type, can i not get it in any other way?

Comment 9 (In reply to #8) by Raymond Camden posted on 5/30/2016 at 6:07 PM

Not sure. You may need to file a bug report.