使用 JavaScript 提取音频文件持续时间：处理原始 WebM 数据

使用 JavaScript 处理 WebM 音频持续时间：深入的解决方案

使用 HTML5 的 JavaScript 前端方法 声音的 具有 Blob 处理功能的元素

// Create an audio element and load raw audio data to get the duration
const rawAudio = 'data:audio/webm;codecs=opus;base64,GkXfo59ChoEBQveBAULygQRC84EIQoKEd2...';
// Convert the base64 string into a Blob
const byteCharacters = atob(rawAudio.split(',')[1]);
const byteNumbers = new Uint8Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
  byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const blob = new Blob([byteNumbers], { type: 'audio/webm' });

// Create an audio element and load the Blob URL
const audio = new Audio();
audio.src = URL.createObjectURL(blob);
audio.addEventListener('loadedmetadata', () => {
  console.log('Audio duration:', audio.duration);
});

使用 FileReader 从 WebM 音频获取持续时间

将 JavaScript 与 FileReader API 结合使用以实现更好的文件处理

// Function to handle raw audio duration retrieval via FileReader
const getAudioDuration = (file) => {
  const reader = new FileReader();
  reader.onload = (e) => {
    const audio = new Audio();
    audio.src = e.target.result;
    audio.addEventListener('loadedmetadata', () => {
      console.log('Duration:', audio.duration);
    });
  };
  reader.readAsDataURL(file);
};
// Usage: Call with a Blob or File object
// getAudioDuration(blob);

用于音频持续时间提取的 Node.js 后端解决方案

使用 Node.js 和 ffmpeg 用于服务器端音频分析的库

// Install ffmpeg library: npm install fluent-ffmpeg
const ffmpeg = require('fluent-ffmpeg');
const fs = require('fs');

// Function to get audio duration on the backend
const getAudioDuration = (filePath) => {
  return new Promise((resolve, reject) => {
    ffmpeg.ffprobe(filePath, (err, metadata) => {
      if (err) return reject(err);
      resolve(metadata.format.duration);
    });
  });
};

// Usage: Call with the path to the WebM audio file
getAudioDuration('path/to/audio.webm').then(duration => {
  console.log('Audio duration:', duration);
}).catch(console.error);

使用 JavaScript 检索音频持续时间的基本常见问题解答

1. 我怎样才能确保 loadedmetadata 事件持续触发？
2. 使用 preload 具有值的属性 "metadata" 可以帮助浏览器预先加载所需的数据。
3. 将 Base64 音频字符串转换为音频字符串的目的是什么 Blob？
4. 它允许您将原始音频数据视为文件，可以将其分配给 audio 用于播放或元数据提取的元素。
5. 什么会导致 audio.duration 要归还的财产 NaN？
6. 当元数据未正确加载时，通常会发生这种情况，可能是由于浏览器中不支持的格式或编解码器问题。
7. 有没有办法在加载文件之前检查音频格式兼容性？
8. 您可以使用 canPlayType() 的方法 audio 元素来检测浏览器是否支持给定的音频格式。
9. 可以在后端提取音频元数据吗？
10. 是的，使用类似的工具 ffmpeg.ffprobe() 在 Node.js 环境中，您可以检索元数据，例如服务器端的持续时间。

使用 JavaScript 检索音频持续时间的要点

提取音频持续时间的过程涉及了解浏览器限制、音频格式以及如何使用 JavaScript 处理原始音频数据。使用 斑点, 声音的 元素和事件，例如 加载的元数据 确保元数据顺利访问。

此外，服务器端工具如 ffmpeg 当浏览器支持不一致时提供可靠的后备。通过结合前端和后端解决方案，开发人员可以确保准确、无缝地处理音频文件，而不受格式限制或网络问题的影响。