1

我通过 Firefox 的 html5 功能播放了波形格式的流式音频。因为我们的一些用户抱怨音频断断续续，我们决定想出一个策略来衡量音频的速率是否足以维持播放。我们首先尝试了 canplaythrough 事件，但显然浏览器对它过于乐观，并不太奏效。这是我使用 jquery 提出的一些代码。我是一个 js/jquery 初学者，所以我想看看是否有人有更好的想法。

$(document).ready(function() {
var previous_buffer = 0;
var start_time = (new Date()).getTime();

// function to check how fast buffer is
function checkBufferSpeed() {
    // if we havent started buffering yet, return
    if (this.buffered.length < 1)
    {
        return;
    }
    // get the current buffer status
    var current_buffer = this.buffered.end(0);
    console.log("current_buffer:" + current_buffer);
    // if we get the same current buffer twice, browser is done buffering
    if (current_buffer > 0 && current_buffer == previous_buffer)
    {
        this.play();
        $("#audio").off("progress");
        return;
    }
    // get the time spent
    var time_spent = ((new Date()).getTime() - start_time)/1000;
    console.log("time_spent:" + time_spent);
    // if we buffered faster than time spent, play
    if (current_buffer > time_spent)
    {
        this.play();
        $("#audio").off("progress");
        return;
    }
    previous_buffer = current_buffer
}

$("#audio").on("progress", checkBufferSpeed);
});

另外，我不检查音频元素持续时间变量的原因是因为 firefox 似乎总是将其报告为无限，除非流已经被缓存。

此外，即使流在缓存中完全可用，firefox 似乎总是触发 2 个进度事件，这就是为什么我要检查我是否有两次相同的缓冲区，如果有，只播放声音。

浏览器是否有可能永远不会触发进度事件？我可以对此代码进行任何改进以使其更好吗？

4

0 回答 0