vue中使用原生js获取音频、视频的播放时长

最近工作中遇到了一个没有写过的需求:需要判断用户上传的音频、视频时长。
于是我就百度搜索了一下,现在自己整理了一下大概的思路,分享给大家。

<input type="file" @change="chance($event)" />
  chance(e) {
     
            const file = e.target.files[0]
            // 定义一个音频实例对象
            let audio = new Audio()
            // 将本地的音频地址给这个空的音频实例对象,从而可以得到我们需要的数据。
            try {
     
                audio.srcObject = file
            }catch {
     
                audio.src = URL.createObjectURL(file)
            }
            // 当音频的元数据加载完成时就可以获取到音频、视频的时长、尺寸、以及文本轨道等内容。
            audio.addEventListener('loadedmetadata', () => {
     
                // 这是视频音频的播放时长
                console.log(audio.duration)  // 得到这个音频的播放时长,单位是秒。
            })

        }

你可能感兴趣的:(技术分享,javascript,前端,vue.js)