Javascript FileReader doesn't fire events on large files

I am trying to play video files from and on a client computer. The thing is, getting the absolute path is quite difficult, so I can put it in an attribute video

src

or object

data

. Eventually I find a FileReader object and it works fine with small files. However, it does not fire the onload event when reading large files (up to 200MB +). No error, FileReader.onerror fires nothing, try / catch doesn't help. The developer console doesn't show anything.

I think it has something to do with the maximum file size in each browser config, but I can't find a way to tweak it. Help?

Here's the code

function onclick()
{
            var file_dialog = document.getElementById("file_dialog");
            var path_dialog = document.getElementById("path_dialog");
            var video_player = document.getElementById("video_player");
            var begin_video = document.getElementById("begin_video");
            var reading_progress = document.getElementById("reading_progress");
            file_dialog.onchange = function ()
            {
                begin_video.disabled = file_dialog.files.length == 0 || path_dialog.files.length == 0;
            };
            path_dialog.onchange = file_dialog.onchange;
            begin_video.onclick = function ()
            {
                begin_video.disabled = true;
                var reader = new FileReader();
                reader.onload = function (e)
                {
                    video_player.src = e.target.result;
                    begin_video.disabled = false;
                };
                reader.onprogress = function (e)
                {
                    reading_progress.textContent = "Reading... " + (Math.floor(e.loaded / e.total * 10000) / 100) + "%";
                };
                reader.onloadend = function (e)
                {
                    if (e.target.error != null)
                        reading_progress.textContent = e.target.error.code;
                    else
                        reading_progress.textContent = "FINISHED!!!";
                };
                reader.onerror = alert;
                reader.readAsDataURL(file_dialog.files[0]);
                var reader2 = new FileReader();
                reader2.onload = function (e)
                {

                };
            };
}

      

+3


source to share


1 answer


There is no such browser configuration setting for this. I have also worked with FileReader and large files (up to 50MB) and browsers behave very differently:

  • Chrome => did well and was the most "responsive"
  • Firefox => not as good as Chrome, high memory consumption but worked
  • IE => worked for so long that the file was below 15MB, just didn't process the file above the browser - no feedback, no event triggered


Perhaps this is a memory problem - the same files were tested with a different machine with less memory, and IE refused to work with 5MB files already.

0


source







All Articles