两种方式获取file上传和vue plupload上传的视频音频时长
file上传视频和音频时获取其时长
//获取视音频时长
//file为上传的文件,获取方式请看实例
var url = URL.createObjectURL(file);
var audioElement = new Audio(url);
var duration = 0;
audioElement.addEventListener("loadedmetadata", function(_event) {
duration = Math.floor(audioElement.duration);
console.log('多媒体时长', duration);
});
//end;
vue plupload上传视频和音频时获取其时长
vue 使用plupload上传时获取到的file是进过拦截后的数据,getNative可获取到file真实数据
//获取视音频时长
//file为上传的文件,获取方式请看实例
var file = file.getNative();//获取被plupload处理后的真实
var url = URL.createObjectURL(file);
var audioElement = new Audio(url);
var duration = 0;
audioElement.addEventListener("loadedmetadata", function(_event) {
duration = Math.floor(audioElement.duration);
console.log('多媒体时长', duration);
});
//end;
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="file" id='upload'>
<button onclick="getTimes()">获取时长</button>
</body>
<script>
function getTimes() {
var obj_file = document.getElementById("upload");
var file = obj_file.files[0];//上传的文件
//获取时长
var url = URL.createObjectURL(file);
var audioElement = new Audio(url);
var duration = 0;
audioElement.addEventListener("loadedmetadata", function (_event) {
duration = Math.floor(audioElement.duration);//s为单位
console.log('多媒体时长', duration);
});
}
</script>
</html>
远程视频音频源地址获取时长
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>获取时长</title>
</head>
<body>
<audio id="myAudio" controls>
<source type="audio/mpeg" src="https://wenhui-1300165533.cos.ap-shenzhen-fsi.myqcloud.com/web/%E7%AC%AC%E4%BA%8C%E8%8A%82%20%E8%81%8C%E8%83%BD%E9%83%A8%E9%97%A8%E5%AE%9A%E7%BC%96%E9%80%BB%E8%BE%91%E4%B8%8E%E7%AE%A1%E7%90%86%E4%BB%B7%E5%80%BC.mp4">
<source type="audio/ogg" src="https://wenhui-1300165533.cos.ap-shenzhen-fsi.myqcloud.com/web/%E7%AC%AC%E4%BA%8C%E8%8A%82%20%E8%81%8C%E8%83%BD%E9%83%A8%E9%97%A8%E5%AE%9A%E7%BC%96%E9%80%BB%E8%BE%91%E4%B8%8E%E7%AE%A1%E7%90%86%E4%BB%B7%E5%80%BC.mp4">
</audio>
<button onclick="getTimes()">获取时长</button>
<script>
function getTimes(){
var duration = document.getElementById("myAudio").duration;
console.log('多媒体时长', duration);
}
</script>
</body>
</html>