如何修复 MediaSource 显示的 Uncaught DOMException 错误？

问题描述

我正在使用从 Mozilla 开发人员那里获取的代码来创建媒体源，此代码在他们的网站上运行良好。但是当我把它放入我的然后放入我的链接时，视频不播放并且浏览器日志显示错误

未捕获的 DOMException：无法在“MediaSource”上执行“endOfStream”：MediaSource 的 readyState 不是“open”。在 SourceBuffer。

我不知道为什么当我放置直接链接时视频效果很好（我不想这样做）

这里是 mozilla 网站的链接 https://developer.mozilla.org/en-US/docs/Web/API/MediaSource/MediaSource

我的脚本与示例完全一样

<script>
      var assetURL = 'teste.mp4';
      // Need to be specific for Blink regarding codecs
       //./mp4info teste.mp4 | grep Codec
      var mimeCodec = 'video/mp4; codecs="avc1.42E01E,mp4a.40.2"';

      if ('MediaSource' in window && MediaSource.isTypeSupported(mimeCodec)) {
        var mediaSource = new MediaSource;
        //console.log(mediaSource.readyState); // closed
        video.src = URL.createObjectURL(mediaSource);
        mediaSource.addEventListener('sourceopen',sourceOpen);
      } else {
        console.error('Unsupported MIME type or codec: ',mimeCodec);
      }

      function sourceOpen (_) {
        //console.log(this.readyState); // open
        var mediaSource = this;
        var sourceBuffer = mediaSource.addSourceBuffer(mimeCodec);
        fetchAB(assetURL,function (buf) {
          sourceBuffer.addEventListener('updateend',function (_) {
            mediaSource.endOfStream();
            video.play();
            //console.log(mediaSource.readyState); // ended
          });
          sourceBuffer.appendBuffer(buf);
        });
      };

      function fetchAB (url,cb) {
        console.log(url);
        var xhr = new XMLHttpRequest;
        xhr.open('get',url);
        xhr.responseType = 'arraybuffer';
        xhr.onload = function () {
          cb(xhr.response);
        };
        xhr.send();
      };

    </script>

这是怎么回事？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

html javascript media-source