Присвоение результата из createObjectURL изображению не позволяет загрузить ресурс в мобильном Safari

Question

Я снимаю изображение с камеры следующим образом:

<input type="file" accept="image/*" capture="camera">

Я привязываюсь к событию изменения входа.

var input = document.querySelector('input');
input.addEventListener('change',  processFile);

Когда изображение сделано (иливыбирается из библиотеки) вызывается функция processFile:

processFile = function (e) {
    var imageUrl = URL.createObjectURL(e.target.files[0]);
    var image = new Image();
    image.src = imageUrl;
}

Это прекрасно работает для большинства браузеров, но в мобильном Safari (10.1) я получаю следующее исключение:

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (blob:https://example.com/29ce6a7c-c266-4b39-8de2-9ec61cc38455, line 0)

Iотлажена, и происходит ошибка, когда я присваиваю imageUrl (blob :) свойству src объекта img.

Я также воспроизвел это в небольшом коде:

https://codepen.io/geersch/pen/rKrwEN

Сбой только на iOS 10.1 для меня.Также протестирован с iOS 10.3.2 и там все работает нормально.Кто-нибудь знает, что происходит?

Answer 1

Оказалось, что устройство iPad, на котором возникла проблема, работало на iOS 10.1 beta 1, что, скорее всего, является причиной проблемы.