通过FileReader API获取上传音频的长度

前言

FileReader 接口允许 Web 应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。

实现 

调用FileReader API，并通过(window.AudioContext || window.webkitAudioContext)()创建音频上下文对象实现

代码示例

关键代码

const customRequest = (file) => {//创建FileReaderconst fileReader = new FileReader();//读取成功完成时触发fileReader.onload = (event) => {const arrayBuffer = event.target.result;//创建音频上下文对象const audioContext = new (window.AudioContext ||window.webkitAudioContext)();audioContext.decodeAudioData(arrayBuffer, async (buffer) => {const duration = Math.floor(buffer.duration); // 获取音频时长console.log("音频时长:", duration);//下面可做对音频时长限制的操作});};//当读取由于错误而失败时触发。fileReader.onerror = (error) => {console.error("Error reading file:", error);};//开始读取指定的 Blob 中的内容，读取完成，result 属性中将包含一个表示文件数据的 ArrayBuffer 对象fileReader.readAsArrayBuffer(file);
};

注意:最后一定要记得调用readAsArrayBuffe来读取内容，不然获取不到FileReader的上下文。