无法在'URL'上执行'createObjectURL':

Question

在Safari中显示以下错误.

function createObjectURL(object) {
    return (window.URL) ? window.URL.createObjectURL(object) : window.webkitURL.createObjectURL(object);
}

我的代码是:

function myUploadOnChangeFunction() { 
    if (this.files.length) { 
       for (var i in this.files) { 
           if (this.files.hasOwnProperty(i)) { 
              var src = createObjectURL(this.files[i]); 
              var image = new Image(); 
              image.src = src; 
              imagSRC = src; 
              $('#img').attr('src', src); 
            }
       }           
   } 
} 

这是我的图片代码:

function createObjectURL(object) {
    return (window.URL) ? window.URL.createObjectURL(object) : window.webkitURL.createObjectURL(object);
}

Answer 1

当我传递给createObjectURL()原始数据时,我遇到了同样的错误:

const mediaStream = new MediaStream();
const video = document.getElementById('video-player');
video.srcObject = mediaStream;

它必须是MediaStream,srcObject或HTMLMediaElement对象,而不是数据本身.这对我有用:

window.URL.createObjectURL(data)

另请查看MDN以获取更多信息:https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL

Answer 2

导致此错误的原因createObjectURL是Google Chrome不推荐使用此功能

我改变了这个:

video.src=vendorUrl.createObjectURL(stream);
video.play();

对此:

video.srcObject=stream;
video.play();

这对我有用.

Answer 3

我的代码被破坏，因为我使用的是过时的技术。过去是这样的：

video.src = window.URL.createObjectURL(localMediaStream);
video.play();

然后我将其替换为：

video.srcObject = localMediaStream;
video.play();

效果很好。

编辑：最近localMediaStream已被弃用并替换为MediaStream。最新的代码如下所示：

video.srcObject = MediaStream;

参考文献：

1. 不建议使用的技术：https : //developer.mozilla.org/zh-CN/docs/Web/API/URL/createObjectURL
2. 不推荐使用的现代技术：https：//developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/srcObject
3. 现代技术：https：//developer.mozilla.org/en-US/docs/Web/API/MediaStream

Answer 4

我对MediaStream有同样的错误.解决方案是为srcObject设置流.

来自文档:

重要提示:如果仍有依赖createObjectURL()的代码将流附加到媒体元素,则需要更新代码以直接将srcObject设置为MediaStream.

Answer 5

后退视频：

try {
  video.srcObject = mediaSource;
} catch (error) {
  video.src = URL.createObjectURL(mediaSource);
}
video.play();

来自：https : //developer.mozilla.org/zh-CN/docs/Web/API/HTMLMediaElement/srcObject

Answer 6

问题是循环中提供的键不引用文件的索引。

for (var i in this.files) {
    console.log(i);
}

上述代码的输出是：

0
length
item

但预期的是：

0
1
2
etc...

那么当浏览器尝试执行时就会出现错误，例如：

window.URL.createObjectURL(this.files["length"])

我建议基于以下代码实现：

var files = this.files;
for (var i = 0; i < files.length; i++) {
    var file = files[i],
        src = (window.URL || window.webkitURL).createObjectURL(file);
    ...
}

我希望这可以帮助别人。

问候！