为什么我的视频元素不能播放我的Blob URL？

Question

我正在从录制的视频Blob（MediaRecorder API）创建Blob URL。然后，我将视频元素的src设置为此Blob URL，但视频不播放录制内容。相反，它默认返回到摄像头流（用于记录）。

我尝试将video元素中的source元素用作某些文档使用。我也尝试过直接使用Blob播放视频。两者都不起作用。

// this is the callback that fires when the mediaRecorder is done recording

mediaRecorder.onstop = (e) => {

          // creating new blob (binary large obj) defining it as an webm file
          let blob = new Blob(buffer, { 'type': 'video/webm' });
          t.setState({ video: blob }, () => {
            // send this video blob to the server
            t.sendVideo()
          })

          // clean up buffer array to free up memory
          buffer = []
          // convert blob into object URL (can be used as video src)
          let videoURL = URL.createObjectURL(blob)
          t.setState({blobURL:videoURL})        
        }

// this shows the render of my app once my blobURL has been set in the local state object

if (this.state.blobURL) {
      return (
        <div>
          <video id='recording' width='100%' height='100%' src ={this.state.blobURL} controls></video>
          <button>Retake Video</button>
          <button>Train Model</button>
        </div>
      );

我希望video元素播放刚刚转换为Blob URL的录制Blob。不幸的是，video元素不执行此操作，而是默认返回到原始网络摄像头流：/