gpt4 book ai didi

javascript - 如何使用 Dropzonejs 限制视频的持续时间?

转载 作者:可可西里 更新时间:2023-11-01 13:31:54 25 4
gpt4 key购买 nike

我有一个上传视频的表格,视频的持续时间/长度很重要。

在我用 PHP 上传文件后,我用 FFMpeg 检查视频文件大小的持续时间。

我用 PHP 计算持续时间,需要通过 PHP 以某种方式发送持续时间的值。我想我必须将持续时间附加到 Json 的 $result 变量。

这是我的html

<!DOCTYPE html>
<html>
<head>

<script src=
"//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://rawgit.com/enyo/dropzone/master/dist/dropzone.js"></script>
<link href="css/dropzone.css" rel="stylesheet">
<script type="text/javascript">

Dropzone.options.myDropzone = {

maxFiles: 1,
acceptedFiles: "image/*,video/*",
maxfilesexceeded: function (file) {
this.removeAllFiles();
this.addFile(file);
$('#infomsg').hide();

},

init: function () {
$('#infomsg').hide();

this.on("success", function (result) {

$('#infomsg').show();


$("#boatAddForm").append($('<input type="hidden" ' +
'name="files[]" ' +
'value="' + result.name + '">'));

});
}
};


</script>
<title></title>
</head>
<body>
<p>
This is the most minimal example of Dropzone. The upload in this
example doesn't work, because there is no actual server to handle
the file upload.
</p><!-- Change /upload-target to your upload address -->
<form action="/dropzone/upload.php" class="dropzone" id="my-dropzone"
name="my-dropzone"></form>
<form action="/dropzone/son.php" id="boatAddForm" method="post" name=
"boatAddForm">
<input class="submit" type="submit">
</form>
</body>
</html>

这是我的PHP

<?php
$ds = DIRECTORY_SEPARATOR;

$storeFolder = 'uploads';

if (!empty($_FILES)) {

$tempFile = $_FILES['file']['tmp_name'];

$targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds;

$targetFile = $targetPath. $_FILES['file']['name'];

move_uploaded_file($tempFile,$targetFile);

} else {
$result = array();

$files = scandir($storeFolder); //1
if ( false!==$files ) {
foreach ( $files as $file ) {
if ( '.'!=$file && '..'!=$file) { //2
$obj['name'] = $file;
$obj['size'] = filesize($storeFolder.$ds.$file);
$result[] = $obj;
}
}
}

header('Content-type: text/json'); //3
header('Content-type: application/json');
echo json_encode($result);
}

如果我可以在

之后立即检查自定义 json 响应
 Dropzone.options.myDropzone = {

与其他成功要求一样,我不必为了检查验证而对 if 语句进行正确处理。

基本上我想做什么就做什么

 maxFiles: 1,

没有在 success 里面写任何条件

最佳答案

据我了解,您想在客户端获取视频文件的持续时间。可以使用 HTML5 API 方法。 Original example here .

默认情况下,dropzone.js 中不支持此功能。您必须自己添加此功能。

这是在选择视频文件时获取视频持续时间的示例代码(取自 coursesweb.net)。

<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>

关于javascript - 如何使用 Dropzonejs 限制视频的持续时间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31063933/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com