Почему result из fileReader приходит пустым?

Доброе утро!

Хочу вывести превью файла перед загрузкой на сервер

Использую следующий код для данной задачи:

function showFiles() { // Вывод превью файлов
    $.each(files, function(k, v) {
        var reader = new FileReader();
            reader.onload = function (ev) {
            var src = ev.target.result;
            console.log(src);
        };
        
        reader.readAsDataURL(v);
    });
}

$(document).on('change', '.upload-input', function(e) {
    if(!e.target.files.length){ return; }

    $.each(e.target.files, function(k, v) {
        files.push(v);
    });

    showFiles();
});

Проблема заключается в следующем:

Какие-то файлы отлично показывает, а из каких-то не может достать result

Вернее result приходит, но пустой

Перечитал много информации в гугле, но не нашел ничего рабочего

Все советуют промис, но и с ним не работает

И про ассинхронность тоже читал, но ничего из предложенного не помогает


Повторюсь, мой код работает, но не со всеми файлами

Требуется загружать только изображения и видео

Пожалуйста, объясните почему result из FileReader приходит пустым?

При всем этом, если я иным способом добавлю файл и воспроизвиду его на странице, то могу извлечь из него кадр


Ответы (0 шт):