Загрузка большого файла (более 100 Мб) приводит к сбою только в Chrome - PullRequest
Новая
       37

Загрузка большого файла (более 100 Мб) приводит к сбою только в Chrome

0 голосов
/ 21 ноября 2018

Я разрешаю пользователям загружать файлы CSV через веб-сайт.Файл читается с использованием API-файла JavaScript, а затем отправляется на сервер для сохранения.

,   upload: function (prefix, numberType, file, name)
{
    this.attributes = { // Set the data to be sent along
        'upload': true,
        'prefix': prefix,
        'file': file,
        'name': name,
        'numberType': numberType 
    };

    console.log('upload', this) // This will correctly show in the console

    return this.sync('create', this, { // This is when Chrome crashes
        xhr: function() {
            var xhr = $.ajaxSettings.xhr();
            xhr.upload.onprogress = function(evt){
                document.querySelector('.uploadProgressBar').style.width = parseInt(evt.loaded/evt.total*100) + '%';
                document.querySelector('#uploadNow').classList.add('percentageUpload');
                document.querySelector('#uploadNow').innerText = parseInt(evt.loaded/evt.total*100) + '%';
            };
            return xhr;
        }
    });
}

При просмотре вкладки сети кажется, что запрос никогда не отправляется, поэтому он прерывается в момент его создания.Это прервется только тогда, когда размер файла составит около 100 МБ, а файлы меньшего размера будут загружены нормально.Кроме того, он будет отлично работать как в Safari, так и в Firefox, так что это проблема Chrome.Является ли это известной проблемой в Chrome, когда у него возникают проблемы с большими файлами?

Я думаю, что единственный способ обойти эту проблему - это разбить файл на куски и собрать его вместе на сервере.,Это, конечно, будет возможно, но стоило бы выяснить, стоит ли это ограничивать в будущем.

1 Ответ

0 голосов
/ 21 ноября 2018

Браузер аварийно завершает работу, потому что ему не хватает памяти.

Вместо загрузки файла в память передайте объект файла в XMLHttpRequest, чтобы Chrome мог передавать содержимое файла в форму загрузки.

Для этого используйте объект FormData: 

// your file input
const file = document.getElementById('file').files[0];
// your form
var form = new FormData();
form.append('file', file);

const xhr = $.ajaxSettings.xhr();

xhr.upload.onprogress = function(evt) {
  document.querySelector('.uploadProgressBar').style.width = parseInt(evt.loaded / evt.total * 100) + '%';
  document.querySelector('#uploadNow').classList.add('percentageUpload');
  document.querySelector('#uploadNow').innerText = parseInt(evt.loaded / evt.total * 100) + '%';
};
xhr.open('POST', 'http://example.com/'); // Url where you want to upload
xhr.send(form);
...