上传视频或音乐时获取时长信息
1. 视频时长获取
VUE中使用的一个方式
handleBeforeUpload(file) {
const that = this
var video = document.createElement('video')
video.src = URL.createObjectURL(file)
video.oncanplay = function() {
var duration = video.duration
console.log('视频长度：', duration)
that.$emit('duration', Math.ceil(duration))
}
},
2. 音乐时长获取
<!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 content = obj_file.files[0]
console.log(content)
//获取录音时长
var url = URL.createObjectURL(content);
//经测试，发现audio也可获取视频的时长
var audioElement = new Audio(url);
var duration;
audioElement.addEventListener("loadedmetadata", function (_event) {
duration = audioElement.duration;
console.log(duration/60);
});
}
</script>
</html>
对以上代码进行简单说明：
1.**URL.createObjectURL() **静态方法会创建一个
DOMString，其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的document绑定。这个新的URL 对象表示指定的File对象或Blob对象。（个人感觉可以把对象转换成url使用，十分灵活方便，特别是对于文件对象）。2.loadedmetadata 当指定的音频/视频的元数据已加载时，会发生 loadedmetadata 事件。音频/视频的元数据包括：时长、尺寸（仅视频）以及文本轨道。
