从blob

时间:2018-06-06 13:03:17

标签: html reactjs video jsx filereader

我正在尝试从React中的blob创建一个视频元素。我做了这么多。但它似乎没有用。这段代码有什么问题吗?

loadBlob(blob, callback) {

    const reader = new FileReader();
    reader.readAsDataURL(blob);

    reader.onload = (event) => {
      const result = event.target.result;     
      callback(result)
   }
}

createVideo(result) {
 this.setState({
    src:result
  })
}

loadBlob(blob, createVideo) /*Passing the blob and the callback in the click button click event*/

在渲染中我

 <video>
   <source src = {this.state.src}/>
 </video>

当我使用检查器检查时,src在视频元素中设置。 当我控制台注销blob时,我得到了这个

Blob(231112) {size: 231112, type: "video/webm"}. 

我想知道是否可以使用Filereader对视频进行此操作?

1 个答案:

答案 0 :(得分:0)

啊,评论中的讨论让我意识到了这个问题。

您不应将data: URI用于大型数据;而是使用URL.createObjectURL(blob)