How to get the filename from the Javascript FileReader?

Question

I'm using the Javascript FileReader to load an image in the browser:

e = e.originalEvent; e.dataTransfer.dropEffect = 'copy'; this.documentFile = e.dataTransfer.files[0];  var reader = new FileReader(); reader.onloadend = function () {     if (reader.result) {         console.log(reader);         $('#theImage').attr('src', reader.result);     } }; reader.readAsDataURL(this.documentFile); 

This works fine. I now want to get the original filename of the image, but I've got no clue how and looking around the internet I can't find anything either?

Does anybody know how I can get the filename through the FileReader? All tips are welcome!

Answer 1

This is prob not the best solution, BUT it worked for me.

var reader = new FileReader(); reader.fileName = file.name // file came from a input file element. file = el.files[0]; reader.onload = function(readerEvt) {     console.log(readerEvt.target.fileName); }; 

Not the best answer, but a working one.

Answer 2

I just faced the same issue, here's how I fixed it:

Using FileReader

 const reader = new FileReader();  reader.readAsDataURL(event.target.files[0]); // event is from the HTML input  console.log(event.target.files[0].name);