persist file reference with html5

Question

I am trying to play media files from local file system. The user now selects a file through 'input' and plays it. I wish to persist that file reference ,so that when the user visits next time , i should be able to tell him/her how many times he/she played it before when etc.,

I should either download the file reference from the server or store it locally .. any ideas how to perform this ?

Answer 1

You can store the information of the audio or video into client's side using IndexedDB or localStorage. Local Storage is easier to use IMO:

var obj = {
        "timestamp": new Date(),
        "title": "Blah Blah",
        "Performer": "Lady Blahblah"
    };

localStorage["previous"] = JSON.stringify(obj);

But notice that you won't be able to get the file's full path, and this prevent you from playing the same file next time. One possible solution is to store the file in Base-64, and directly put it into <video> or <audio>, which I am using this method to store file in the Google Chrome extension I made.

Answer 2

Is there any reason that you need to store the file itself? From what I read it sounded like you just want to be able to keep a tally of the times its been played. This could be accomplished by just hashing the file and then keeping your tally associated with the hash of the file rather than the file itself in something like localstorage.

Brief example using a javascript md5 implementation by someone i found on google included in the comments.

http://jsfiddle.net/influenztial/b3b2V/2/