Question

I am currently loading dropped files by doing:

var files = e.dataTransfer.items;
for (var i = 0; i < files.length; i++) {
    var file = files[i]; //typeof is 'DataTransferItem'
    var url = URL.createObjectURL(file);
}

This gets me the object url, which I can then put into a music player. However, when iterating over an inputted folder:

var reader = entry.createReader();
reader.readEntries(function (res) {
    res.forEach(function (entry) {
        console.log('The entry:', entry);
        console.log('The url:', JSON.stringify(entry.toURL()));
    });
});

I get files of type FileEntry. According to this I shall be able to do file.toURL() and use that instead of an object url. This does return me an empty string. this seems to be there for a reason, but I have no idea how to fix this. I see something about a blob URL but I have no idea how that would work. Example Try to drag files and folders to the output screen and see it yourself

Was it helpful?

Solution

How I fixed it:

from an entry with typeof FileEntry, we can just do .file(callback), where the first parameter in the callback is of type File, which we can then just create an objectURL from:

var reader = entry.createReader();
reader.readEntries(function (res) {
    res.forEach(function (entry) {
        entry.file(function(file){ //this does the trick
            var obj = URL.createObjectURL(file);
        }
    });
});

Many thanks to dandavis who provided me his javascript code and the approximate line so I could go look for it myself ;)

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top