检测HTML5音频流何时中断或暂停

Question

我正在尝试使用Cordova应用程序上的HTML5音频流式传输Shoutcast URL.

我遇到的问题是:当音频流失去与ShoutCast URL的连接时,似乎没有回调.在此阶段,音频元素显示它正在播放音频,但没有音频.

码

Radio = {
    initialized: false,
    isBuffering: false,
    interrupted: false,
    isPlaying: false,
    media: null,
    trackName: '',
    url: 'shoutcast_url',
    initialize: function () {
        if (!this.media) {
            this.media = new Audio(this.url);

            this.media.preload = "none";

            this.media.onerror = function (e) {
                App.alert("Unable to connect to Radio");
                Radio.interrupt();
            };

            this.media.onwaiting = function (e) {
                Radio.set_buffering(true);
            };

            this.media.onplaying = function (e) {
                Radio.set_buffering(false);
            };
        }
    },
    set_buffering: function (value) {
    ...
    }

脚本

• 连接到Internet(例如,通过热点)并启动音频收音机.
• 断开热点与Internet的连接.

播放缓冲内容后,音频停止播放.但没有发出表示连接丢失的回调.

• media.networkState是2(NETWORK_LOADING)
• media.playbackRate是1(以正常速度向前播放)
• media.readyState是4(HAVE_ENOUGH_DATA)
• media.preload 是 none

我尝试过的回调(连接丢失时没有触发)是:

• onstalled
• onreset
• onsuspend
• onerror
• onprogress
• onwaiting

问题 - 由于缺少连接而无法播放音频时是否会触发音频回调？

如果没有,是否有任何方法会更新readyState或networkState？如果是这样,我可以设置一个计时器来检查这些值.

Answer 1

您确定失去连接实际上是您想要的吗？音频可能会停止，并且您的连接实际上会丢失，而底层 TCP 连接实际上并未关闭。您可能有几个小时没有数据，实际上是死连接，但该 TCP 连接仍然处于活动状态。

相反，我建议查看播放时间。（您的 onprogress 处理程序也有效。）如果在您设置的超时（10 秒或任何适合您的情况）后没有增加，则清除音频播放器并尝试重新连接。

Answer 2

当使用 HTML5 音频播放受支持的音频流时，确定音频是否正在播放的最佳方法是侦听事件timeupdate。

当 currentTime 属性指示的时间已更新时，将触发 timeupdate 事件。

仅当播放音频时才会触发该事件。如果音频由于任何原因停止，timeupdate也不会触发。

然而，浏览器支持并不完整。

• 在 Android 5.0 (Chrome 48) 上，timeupdate从不触发也不currentTime更新。
• 在最新的桌面浏览器（Mozilla 45 和 Chrome 49）上，timeupdate功能如文档所述。