I want to limit the user to upload only videos with duration up to 30 sec.Is there any Way?
Asked
Active
Viewed 1.1k times
8
-
see https://stackoverflow.com/questions/29285056/get-video-duration-when-input-a-video-file – Satish Sharma Nov 18 '17 at 07:10
-
2Possible duplicate of [Get video duration when input a video file](https://stackoverflow.com/questions/29285056/get-video-duration-when-input-a-video-file) – Satish Sharma Nov 18 '17 at 07:10
-
see also https://stackoverflow.com/questions/27550529/how-to-check-length-duration-of-an-uploaded-video-in-javascript – Satish Sharma Nov 18 '17 at 07:11
-
You can find your answer here [video-upload-check-only-30-second-video-will-upload] (https://stackoverflow.com/questions/28585277/video-upload-check-only-30-second-video-will-upload) – Ritesh Khatri Nov 18 '17 at 07:14
1 Answers
13
Try this
<form action="#" method="post" enctype="multipart/form-data">
File: <input type="file" name="fup" id="fup" /><br>
Duration: <input type="text" name="f_du" id="f_du" size="5" /> seconds<br>
<input type="submit" value="Upload" />
</form>
<audio id="audio"></audio>
<script>
// Code to get duration of audio /video file before upload - from: http://coursesweb.net/
//register canplaythrough event to #audio element to can get duration
var f_duration =0; //store duration
document.getElementById('audio').addEventListener('canplaythrough', function(e){
//add duration in the input field #f_du
f_duration = Math.round(e.currentTarget.duration);
document.getElementById('f_du').value = f_duration;
URL.revokeObjectURL(obUrl);
});
//when select a file, create an ObjectURL with the file and add it in the #audio element
var obUrl;
document.getElementById('fup').addEventListener('change', function(e){
var file = e.currentTarget.files[0];
//check file extension for audio/video type
if(file.name.match(/\.(avi|mp3|mp4|mpeg|ogg)$/i)){
obUrl = URL.createObjectURL(file);
document.getElementById('audio').setAttribute('src', obUrl);
}
});
</script>

Channa
- 3,267
- 7
- 41
- 67