2016-05-10 91 views
2

當通過HTML5輸入上傳的視頻如:我可以爲HTML5文件上傳設置視頻長度限制嗎?

<input type="file" id="input">

我知道這是可能使用PHP/Node.js的設置文件大小的限制

有沒有辦法對視頻長度設置限制,而不是文件大小?

I.E:只允許用戶上傳15秒或更短的視頻。

+0

這裏嘗試這樣的回答:http://stackoverflow.com/questions/31623222/set-duration-of-video -play-with-html5它可以解決你的需求。 – Cutter

+0

您將始終需要接受服務器上的文件以運行mediaInfo查詢來查看剪輯的長度,如果剪輯太長,可以將其刪除。但它需要到達您的服務器才能確定。 。 - > **原因是你不能在客戶端文件系統上執行任何你需要的操作。** – Pogrindis

+0

嗯。如果客戶可以首先上傳整個文件,那可以做到這一點。我不認爲在上傳文件之前可能有任何方法告訴這些信息,就像文件大小一樣,但如果有其他人有想法,它真的會救我!謝謝JD。 –

回答

2

這裏是我的發現:

解決方案1: 創建一個播放本地視頻文件,然後在其上運行video.duration視頻元素。

var vid = document.getElementById("myVideo"); 
 

 
function myFunction() { 
 
    alert(vid.duration); 
 
} 
 

 
(function localFileVideoPlayer() { 
 
\t 'use strict' 
 
    var URL = window.URL || window.webkitURL 
 
    var displayMessage = function (message, isError) { 
 
    var element = document.querySelector('#message') 
 
    element.innerHTML = message 
 
    element.className = isError ? 'error' : 'info' 
 
    } 
 
    var playSelectedFile = function (event) { 
 
    var file = this.files[0] 
 
    var type = file.type 
 
    var videoNode = document.querySelector('video') 
 
    var canPlay = videoNode.canPlayType(type) 
 
    if (canPlay === '') canPlay = 'no' 
 
    var message = 'Can play type "' + type + '": ' + canPlay 
 
    var isError = canPlay === 'no' 
 
    displayMessage(message, isError) 
 

 
    if (isError) { 
 
     return 
 
    } 
 

 
    var fileURL = URL.createObjectURL(file) 
 
    videoNode.src = fileURL 
 
    } 
 
    var inputNode = document.querySelector('input') 
 
    inputNode.addEventListener('change', playSelectedFile, false) 
 
})()
<h3>Step 1: Upload a video</h3> 
 
<h3>Step 2: Get length</h3> 
 
<h3>Step 3: ???</h3> 
 
<h3>Step 4: Profit</h3> 
 
<button onclick="myFunction()" type="button">Get video length</button> 
 
<hr> 
 
<div id="message"></div> 
 
<input type="file" accept="video/*"/> 
 
<video controls autoplay id="myVideo"></video>

解決方案2:使用mediainfo.js https://mediainfo.js.org/

+0

看起來很酷,但當我點擊「獲取視頻長度」時,我得到NaN – Antoine

相關問題