将CreateObjectURL的结果分配给图像无法在Mobile Safari上加载资源

我从相机中拍摄了一张照片,如下所示:

<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;
}

这对大多数浏览器都适用,但在MobileSafari(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)

我调试了,当我将imageurl(blob:)分配给img对象的src属性时,它出错了。

我也用一个小密码笔复制了这个:

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

我只能在iOS 10.1上失败。也使用iOS 10.3.2进行了测试,在那里它工作正常。有人知道发生了什么事吗?