如何在上传之前获得html文件输入的视频分辨率

Question

当我在HTML文件输入上选择一个视频文件时，我想获得视频分辨率(宽度和高度(和所有元数据(大小、长度、文件类型等，如果可能的话(。我需要一个js或jquery解决方案。我找不到任何与这个话题有关的东西。帮我解决这个问题。提前谢谢。

Answer 1

我找到了一种方法。我希望这对某人有用。

当视频文件添加到文件输入时，我们创建一个新的video元素，并将该文件加载到video的src属性中。然后，我们在视频标签的loadedmetadata事件中添加一个事件监听器，在那里我们可以获得视频的高度和宽度。

<input type="file" class="file_multi_video" />
<script>
$(document).on("change", ".file_multi_video", function(evt) {
const video = document.createElement('video')
video.addEventListener('loadedmetadata', event => {
console.log(video.videoWidth, video.videoHeight)
});
video.src = URL.createObjectURL(this.files[0]);
});
</script>