Safari：无法从 blob url 动态加载视频

Posted 2023-05-07

【中文标题】Safari：无法从 blob url 动态加载视频

【英文标题】：Safari: unable to dynamically load video from blob url

【发布时间】：2013-10-05 23:20:48

【问题描述】：

我正在尝试为 html5 视频标签实现动态加载。

当用户通过<input type="file"> 元素选择视频文件时，我想将其动态加载到<video> 元素，并将其附加到正文。

以下代码适用于 Chrome，但不适用于 Safari：

function load_video(file)  // this came from <input type="file"> change event
    var reader = new FileReader();
    reader.onload = function(event) 
        var blob = new Blob([event.target.result]);
        window.URL = window.URL || window.webkitURL;
        var blobURL = window.URL.createObjectURL(blob);
        $('body').append('<video controls  src="' + blobURL + '" onloadedmetadata="alert('loaded meta data!')"></video>');
    

现在， 如果我将src="' + blobURL + '" 替换为本地文件路径，比如/media/videos/vid1.mp4，视频也会加载到Safari 中，但我需要它从blobURL 加载视频。

有什么建议吗？

非常感谢。

更新：

正如 Rod 所说，不幸的是，这是 Safari 中的一个已知错误（它的媒体后端不支持）。

【参考方案1】：

我不知道该解决方案是否适用于视频和音频，但我对 Safari 音频也有同样的问题，我发现解决方案是在构造 blob 时指定内容类型：

var blob = new Blob([arrayBuffer], type: 'audio/mpeg');
url = webkitURL.createObjectURL(blob);

【讨论】：

当我尝试使用内置音频的加载元数据事件从 blob url 获取持续时间时，似乎这个刚刚解决了我的问题。谢谢！

【参考方案2】：

我在 Safari 6.1 上遇到了同样的问题，在尝试从输入加载文件时得到 MEDIA_ERR_SRC_NOT_SUPPORTED，如下所示：

var fileInput = document.querySelector('#file'),
    video = document.querySelector('video');

fileInput.addEventListener('change', function(evt)
  evt.preventDefault();
  var file = evt.target.files[0];
  var url = window.URL.createObjectURL(file);
  video.src = url;

  video.addEventListener('error', function(err)
    // This craps out in Safari 6
    console.error(video.error, err);
    alert('nay :(');
  );
);

试试video.addEventListener('error', logError) 或其他东西，看看你是否有同样的问题。我怀疑 Safari 尚不支持 blob-type 来源的视频。

更新：是的，这是一个错误。请参阅https://bugs.webkit.org/show_bug.cgi?id=101671 并帮助我们让 webkit 维护人员这是需要修复的问题。

2015 年更新：现在可以使用，更新了代码。

【讨论】：

这个问题在后来的 ios Safari 中修复了吗？我找不到任何信息，并且该错误尚未更新

哥们，给你一个发现自己的方法：bl.ocks.org/unRob/3bd07a012597aa959c92

那是什么？它是运行 Safari 后端的页面，还是只是将 blob url 放入视频标签的代码？

对不起，我认为代码是不言自明的。这是一种测试该错误是否已在您愿意测试的任何 iOS 中修复的方法；虽然我已经看到它在 v9.0 中工作，但不能真正说出任何其他版本会发生什么。

好的，代码与我测试过的完全一样，我无法让它在 iOS 7.1 上运行，所以我猜它不受支持。谢谢！