Video.js - 使用createObjectURL创建blob（本地文件@客户端）

Question

我想在本地播放视频（无需将其上传到服务器）。 我能做到这一点的纯JavaScript和HTML5，像这样：

HTML：

<video id="video1"></video> 
<input type="file" id="fileInput" multiple /> 

JavaScript的使用jQuery：

var $video = $('#video1'); 
$video.prop('src', URL.createObjectURL($('#fileInput').get(0).files[0])); 
$video.get(0).play(); 

和它的作品。

，但与下面的代码的Video.js：

var myPlayer = videojs('video1').ready(function() { 
      // ready 
      var filename = URL.createObjectURL($('#fileInput').get(0).files[0]); 
      this.src(filename); 
      this.load(); 
      this.play(); 
     }); 

我得到以下错误：

VIDEOJS: TypeError: Cannot read property '1' of null {stack: (...), message: "Cannot read property '1' of null"}

我猜测，这是因为BLOB没有一个文件扩展名，它看起来像这样：

blob:http%3A//localhost%3A9000/5621470e-593a-4255-8924-f48731b97803

没有人知道这个错误的原因并发挥本地网络连接的方式在video.js的客户端？

感谢， 利奥尔

Answer 1

，我发现我的错误，我 必须通过的文件类型的Video.js像这样：

var myPlayer = videojs('video1').ready(function() { 
      // ready 
      var filename = $('#fileInput').get(0).files[0].name; 
      var fileUrl = URL.createObjectURL($('#fileInput').get(0).files[0]); 
      var fileType = $('#fileInput').get(0).files[0].type; 
      console.log(filename); 
      this.src({ type: fileType, src: fileUrl }); 
      this.load(); 
      this.play(); 
     }); 

现在它工作正常...

Answer 2

要玩blob对象，你可以通过blob如下：

$video.src({type:'video/mp4', src: URL.createObjectURL(..blobObject..)});