window.URL.createObjectURL(blob)创建的视频链接video播放不了

Question

PHP返回的视频二进制

$file = fopen("./test.wmv", 'rb'); #rb表示只读方式打开一个二进制文件  wb写入一个二进制文件数据
$blob = fread($file,filesize("./test.wmv"));

if($blob) {
    echo $blob;
    exit;
}else{
    echo '';
    exit;
}

js获取视频二进制数据

xhr=new XMLHttpRequest()
    xhr.open("POST", "http://localhost/video_blob.php", true);

    xhr.responseType = 'blob';


    xhr.onload = function(e) {
        if (this.status==200) {
            var blob = this.response; // 获取二进制blob数据   

            // 把blob视频二进制数据放入到video容器中
            document.getElementById('mv').src= window.URL.createObjectURL(blob);
        }
    }
    xhr.send()

但是播放不了怎么回事

<video controls="" id="mv" src="blob:http://localhost/5d3064ca-aa5e-45b9-9c2f-9c0a2c0bdc6a"</video>

Answer 1

从你的截图看 貌似是视频损坏。
如果视频正常，通过createObjectURL的方式添加bolb视频资源后。不能直接play()，这里需要用户主动行为去触发play（）。
希望对你有帮助。

Answer 2

video标签不支持这个格式的视频 换成MP4格式（h.264）编码的，还有你的video标签少个>

Answer 3

我也遇到了这个问题，我的原因找到了，在适当的位置设置一下 video.srcObject = null
（我这边同一个 video 之前设置了 srcObject）

Answer 4

我遇到同样的问题，你解决了吗，求教