使用JavaScript检测支持的音频格式

随着流媒体成为我们的主要娱乐来源，并且供应商正在努力创造最佳的视频格式，在我们将视频 发布到我们的网站上之前，检测设备和浏览器视频支持将变得越来越重要。我们对音频的考虑较少，但适用相同的原理：在使用给定音频格式之前，先检查是否支持该格式。那么，如何检测给定的音频类型是否受支持？

我们可以使用来检测音频格式支持HTMLAudioElement.prototype.canPlayType，该策略与视频使用的策略相同：

// Create an audio element so we can use the canPlayType method
const audio = document.createElement('audio');

// Does the device support mp3?
audio.canPlayType('audio/mpeg'); // "probably"

有以下三种可能的结果 canPlayType：

• "probably" ：媒体类型似乎可以播放

• "maybe"：如果不播放，则无法确定媒体类型是否可播放

• ""：媒体类型不可播放

我们可以创建一个类似于我的supportsVideoType 函数的函数来简化音频检测：

function supportsAudioType(type) {
  let audio;

  // Allow user to create shortcuts, i.e. just "mp3"
  let formats = {
    mp3: 'audio/mpeg',
    mp4: 'audio/mp4',
    aif: 'audio/x-aiff'
  };

  if(!audio) {
    audio = document.createElement('audio')
  }

  return audio.canPlayType(formats[type] || type);
}

// Usage
if(supportsVideoType('mp3') === "probably") {
  // Set the video to mp3
}
else {
  // Set the video to wav or other format
}

花时间检测边缘音频和视频格式是非常值得的，它使您可以提供更清晰的媒体并进行更好的压缩以缩短加载时间。在大型或小型媒体网站上都请牢记这些JavaScript函数！