获取使用 angular 选择的本地视频的时长

Question

是否可以验证用户在 angular 中使用文件输入选择的本地视频的持续时间？

我有以下 html 将所选视频绑定到我的模型。

<input type="file" ng-model='video.videoToUpload' accept="video/*" required>

控制器中视频的属性包括文件大小和文件类型，但不包括持续时间。我想避免为了验证持续时间而将视频提交到 Web 服务器的开销。

Answer 1

这不完全适合 Angular-- 但它有效！！我试过 mp4 格式。

var myVideos = [];
window.URL = window.URL || window.webkitURL;
function setFileInfo(files) {
  myVideos.push(files[0]);
  var video = document.createElement('video');
  video.preload = 'metadata';
  video.onloadedmetadata = function() {
    window.URL.revokeObjectURL(this.src)
    var duration = video.duration;
    myVideos[myVideos.length-1].duration = duration;
    updateInfos();
  }
  video.src = URL.createObjectURL(files[0]);;
}

function updateInfos(){
      document.querySelector('#infos').innerHTML="";
  for(i=0;i<myVideos.length;i++){
      document.querySelector('#infos').innerHTML += "<div>"+myVideos[i].name+" duration: "+myVideos[i].duration+'</div>';
     }
  }

<div id="input-upload-file" class="box-shadow">
  <span>- Try Upload -</span> 
  <input type="file" class="upload" id="fileUp" name="fileUpload" onchange="setFileInfo(this.files)">
</div>
<div id="infos"></div>

帮助愉快！

获取使用 angular 选择的本地视频的时长

Get duration of local video selected using angular

video

duration

angularjs