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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13614803/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 19:17:44  来源:igfitidea点击:

How to check if HTML5 audio has reached different errors

javascripthtmlaudio

提问by Neablis

Specifically, if one of the 206 requests for audio fails and buffering stops, is there a way to detect that state? Or should I have to check if buffering stopped by comparing the buffered amounts against past amounts?

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

Also how can I check if the specified source fails, could you then point it to another source?

另外我如何检查指定的源是否失败,然后你能把它指向另一个源吗?

回答by Tom Sarduy

1. Specifically, if one of the requests for audio fails and buffering stops, is there a way to detect that state?

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

Yes, there is few ways to do this! But if you want to catch the error type you can attach the error event listener to the sources:

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

$('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. Could you then point it to another source?

2. 然后你能把它指向另一个来源吗?

Inside the error handler function you can change the source using the srcproperty of the audio element:

在错误处理函数中,您可以使用src音频元素的属性更改源:

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

Another option is to add multiple source to the same audio tag using this syntax:

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

<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. About manage multiple audio files

3.关于管理多个音频文件

I would suggest to use a plugin if you are thinking to manage 206 audio files. I have been using SoundManager2for a while and it's very good!

如果您想管理 206 个音频文件,我建议您使用插件。我一直在使用SoundManager2,它非常好!

回答by cjgammon

There is a complete list of the events handled by media elements in the spec: https://html.spec.whatwg.org/multipage/embedded-content.html#media-elements

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

I would look specifically at the stalled, abort, progress events.

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

Since this element is relatively new implementations may vary greatly. So I would test these events against the platforms you are targeting to see if they work as expected for your needs. If not you may need to do something a bit more manual like polling the buffered state as you had mentioned.

由于此元素相对较新,因此实现可能会有很大差异。因此,我将针对您的目标平台测试这些事件,以查看它们是否按您的预期工作。如果不是,您可能需要做一些手动操作,例如像您提到的那样轮询缓冲状态。

回答by Nemutaisama

I think you can find your answer here w3schoolsat the end of page (Media Events block)

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

probably onerroror onstalledor onreadystatechange

可能onerroronstalledonreadystatechange