使用node.js fs.readStream()在电子html5视频播放器中播放本地视频文件

Question

我正在开发一个视频播放器应用程序，它使用node.js和电子从本地文件系统播放视频(.mp4) (因此我使用chromium的html5视频播放器)。

播放大于2 2GB的视频似乎是我目前方法的一个问题。

我过去常常使用fs.readFileSync读取本地视频文件，并将该Blob传递给视频播放器，如以下代码所示：

this.videoNode = document.querySelector('video');
const file: Buffer = fs.readFileSync(video.previewFilePath);
this.fileURL = URL.createObjectURL(new Blob([file]));
this.videoNode.src = this.fileURL;

这确实适用于小于2 2GB的视频文件。大于2 2GB的文件会触发以下错误：

ERROR RangeError [ERR_FS_FILE_TOO_LARGE]: File size (2164262704) is greater than possible Buffer: 2147483647 bytes
    at tryCreateBuffer (fs.js:328)
    at Object.readFileSync (fs.js:364)
    at Object.fs.readFileSync (electron/js2c/asar.js:597)

我认为解决方案是使用fs.readStream()向html5视频播放器传递一个ReadStream。不幸的是，我找不到任何关于如何将该流传递到视频播放器的文档。

Answer 1

正如主题所说的那样，您正在使用电子，从上面的评论中可以清楚地看出，您正在避免使用服务器。看起来，如果你只是在创建一个离线视频播放器，那么你只是把事情搞复杂了。为什么要先创建一个缓冲区，然后再创建一个新的url？您可以通过简单地获取视频路径并将其作为视频对象的src属性来实现。你的代码应该是这样的-

var path="path/to/video.mp4"; //you can get it by simple input tag with type=file or using electron dialogs
this.videoNode = document.querySelector('video');//it should be a video element in your html
this.videoNode.src=path;
this.videoNode.oncanplay=()=>{
  //do something...
}

这将处理整个文件，并且您不需要禁用视频，因为videoNode是html文件中的webPreference元素。

你可以看看这个开源的媒体播放器项目，它是用电子制作的-

https://github.com/HemantKumar01/ElectronMediaPlayer

免责声明:我是上述项目的所有者，并邀请所有人参与其中。