使用 Web Audio API,我正在尝试构建一个具有"向前跳过 15 秒"功能的 mp3 播放器。
我能够使用源缓冲区加载 mp3,并且可以让它开始播放。我想做这样的事情,尽管我知道 currentTime 不是一个可设置的属性:
context.currentTime += 15
一旦歌曲已经播放,你如何向前跳 n 秒?
不幸的是,没有单一的 API 调用来达到预期的效果,但它是可行的。每个AudioBufferSourceNode
只能使用一次,这就是为什么我们必须创建一个新才能更改某些内容。
假设我们有两个变量来自一个名为audioContext
和audioBuffer
的地方。此外,我们还定义了另外两个变量来存储初始startTime
和当前正在运行的AudioBufferSourceNode
。
let audioBufferSourceNode;
let startTime;
我们第一次玩audioBuffer
我们从一开始就直接玩它。这里唯一特别的是,我们保留了对audioBufferSourceNode
的引用,并且我们记住了startTime
。
audioBufferSourceNode = audioContext.createBufferSource();
audioBufferSourceNode.buffer = audioBuffer;
audioBufferSourceNode.connect(audioContext.destination);
startTime = context.currentTime;
audioBufferSourceNode.start(startTime);
如果您想稍后跳过,则需要先停止先前启动的audioBufferSourceNode
。
const currentTime = context.currentTime;
audioBufferSourceNode.stop(currentTime);
audioBufferSourceNode.disconnect();
此外,还需要通过重用与以前相同的audioBuffer
来创建一个新的。这里唯一的区别是我们应用偏移以确保它提前 15 秒跳过。
audioBufferSourceNode = audioContext.createBufferSource();
audioBufferSourceNode.buffer = audioBuffer;
audioBufferSourceNode.connect(audioContext.destination);
audioBufferSourceNode.start(currentTime, currentTime - startTime + 15);
要准备跳过另一个时间,有必要更新startTime
。
startTime -= 15;
这当然是一个过于简化的例子。实际上,应该进行检查以确保有足够的音频数据可以跳过。您还可以在跳过时应用一点淡入/淡出以避免点击声音。...这只是为了说明一般的想法。