API файлов HTML5 дает сбой Chrome при использовании readAsDataURL для загрузки выбранного изображения

Вот мой пример кода:

var input = document.createElement('input');
input.type = 'file';
document.body.appendChild(input);

input.addEventListener('change', function(){
    var file = input.files[0];

    var reader = new FileReader();
    reader.onload = function(e){
        var image = new Image();
        image.src = e.target.result;
    };
    reader.readAsDataURL(file);
});

Загрузите страницу, выберите большое изображение (я использую изображение размером 2,9 МБ 4288x3216). Обновите страницу и выберите то же изображение. Результат? Вкладка вылетает! (Ой, Snap!)

Я предполагаю, что это ошибка в реализации файлового API в Chrome, но мне бы хотелось, чтобы кто-нибудь подтвердил это и, возможно, даже предложил обходной путь. Я действительно хочу иметь возможность показывать эскиз фотографии без необходимости обращаться к серверу для его создания (даже если это только для Chrome и FF).

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

Спасибо за любую помощь!

9
задан ummwolfcat 2 June 2011 в 16:59
поделиться