如何检查HTML5音频是否已达到不同的错误

时间:2012-11-28 21:32:07

标签: javascript html html5 audio

具体来说,如果206个音频请求中的一个失败并且缓冲停止,是否有办法检测该状态?或者我是否应该通过比较缓冲的金额与过去的金额来检查缓冲是否已停止?

另外,我如何检查指定的源是否失败,您是否可以将其指向另一个源?

3 个答案:

答案 0 :(得分:33)

<强> 1。具体来说,如果其中一个音频请求失败并且缓冲停止,是否有办法检测该状态?

是的,有几种方法可以做到这一点!但是,如果要捕获错误类型,可以将错误事件侦听器附加到源:

$('audio').addEventListener('error', function failed(e) {
   // audio playback failed - show a message saying why
   // to get the source of the audio element use $(this).src
   switch (e.target.error.code) {
     case e.target.error.MEDIA_ERR_ABORTED:
       alert('You aborted the video playback.');
       break;
     case e.target.error.MEDIA_ERR_NETWORK:
       alert('A network error caused the audio download to fail.');
       break;
     case e.target.error.MEDIA_ERR_DECODE:
       alert('The audio playback was aborted due to a corruption problem or because the video used features your browser did not support.');
       break;
     case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
       alert('The video audio not be loaded, either because the server or network failed or because the format is not supported.');
       break;
     default:
       alert('An unknown error occurred.');
       break;
   }
 }, true);

<强> 2。你能将它指向其他来源吗?

在错误处理函数内部,您可以使用audio元素的src属性更改源:

var audio = $(this);
audio.src = "new-audio-file.mp3";
audio.load();

另一种选择是使用以下语法将多个源添加到同一音频标记:

<audio>
    <source id="audio_player_ogv" src="test.ogv" type="audio/ogg" />
    //In case that you can't load the ogv file it will try to load test.mp3
    <source id="audio_player_mp3" src="test.mp3" type="audio/mpeg" />
</audio>

第3。关于管理多个音频文件

如果您打算管理206个音频文件,我建议您使用插件。我一直在使用SoundManager2一段时间,这非常好!

答案 1 :(得分:3)

规范中的媒体元素处理完整的事件列表:https://html.spec.whatwg.org/multipage/embedded-content.html#media-elements

我会特别关注陷入停滞,中止,进展的事件。

由于此元素相对较新,因此实现可能会有很大差异。因此,我会根据您要定位的平台测试这些事件,看看它们是否按预期满足您的需求。如果不是,你可能需要做一些更多的手动操作,比如你所提到的轮询缓冲状态。

答案 2 :(得分:-3)

我想你可以在页面末尾找到你的答案w3schools(媒体事件块)

可能是onerroronstalledonreadystatechange