暂停 Web Audio API 声音播放

Posted

技术标签:

【中文标题】暂停 Web Audio API 声音播放【英文标题】:Pause Web Audio API sound playback 【发布时间】:2013-02-02 22:01:00 【问题描述】:

如何为我的音频创建暂停功能?我在下面的脚本中已经有了播放功能。

http://pastebin.com/uRUQsgbh

function loadSound(url) 
    var request = new XMLHttpRequest();
    request.open('GET', url, true);
    request.responseType = 'arraybuffer';

    // When loaded decode the data
    request.onload = function() 

        // decode the data
        context.decodeAudioData(request.response, function(buffer) 
            // when the audio is decoded play the sound
            playSound(buffer);
        , onError);
    
    request.send();


function playSound(buffer) 
    sourceNode.buffer = buffer;
    sourceNode.noteOn(0);

但是我怎样才能暂停或停止呢?

【问题讨论】:

sourceNode.noteOff(0); 【参考方案1】:

简短的回答是“你不能暂停它——正如 idbehold 所说,你可以通过调用 sourceNode.noteOff(0); 来停止它”。

您不能暂停它,原因与音频电缆上没有“暂停”按钮的原因相同 - 因为数据一直在通过它。您可以实现一个可以暂停的记录器节点,但在某些时候,如果您不取消暂停,它将缓冲大量数据。

实现此场景的常用方法是跟踪您在播放中的位置(例如,通过记住您开始的时间),然后当您想暂停时记住该偏移量,调用 noteOff(0),然后当您想重新开始播放创建一个指向同一缓冲区的新节点并使用偏移量调用 noteOnGrain。

【讨论】:

当我所做的只是解释 API 时,不知道你为什么要否决我的答案。【参考方案2】:

noteOff(0) 的问题是它会破坏AudioNode,因此您将无法使用暂停音频。相反,您可以简单地断开sourceNode,这将有效地暂停音频。要恢复播放,只需重新连接即可。由于您的代码将sourceNode 连接到analyser

function pause() 
    sourceNode.disconnect();


function resume() 
    sourceNode.connect(analyser);

希望有帮助!

【讨论】:

这是 Chrome 实现中的一个错误,实际上 - 不要依赖它继续充当“暂停”。 cwilson 是对的,这是错误的答案,将来不会起作用。这是一个错误,API 不支持。 @cwilso 这个错误有铬票吗?我刚刚遇到了与此相反的情况,试图通过断开和重新连接节点来实现“静音”功能,只是意识到声音在断开连接时恢复到原来的位置,而不是根据上下文 currentTime 恢复到原来的位置。谢谢!【参考方案3】:

在分配缓冲区之前,你已经创建了一个可以使用上下文的bufferSource。 创建bufferSource的方法是“createBufferSource” => context.createBufferSource。创建 bufferSource 后,您使用“context.destination”=> source.connect(context.destination); 创建了一个 conexion。就是这样,现在要玩了,对现代浏览器使用 start(0),对旧浏览器使用 noteOn(0)

function loadSound() 
   xhr = new XMLHttpRequest();
   xhr.open('GET', url, true);
   xhr.responseType = 'arraybuffer';
   xhr.onload = function () 
       /* Processing response data - xhr.response */
       /* Decoding audio data. */
       var context = new webkitAudioContext();
       context.decodeAudioData(xhr.response, function onSuccess (buffer) 
           if (! buffer) 
               alert('Error decoding file data.');
               return;
           
           var source = context.createBufferSource(); /* Create SourceNode. */
           source.buffer = buffer; /* buffer variable is data of AudioBuffer type from the decodeAudioData() function. */
           source.connect(context.destination); /* Connect SourceNode to DestinationNode. */
           source.start(0); /* Play sound. */
       , function onError (error) 
           alert('Error decoding file data.');
       );

   ;
    xhr.onerror = function () 
        /* Handling errors */
        console.log('error');
    ;
    xhr.send();

【讨论】:

以上是关于暂停 Web Audio API 声音播放的主要内容,如果未能解决你的问题,请参考以下文章

Web Audio API:将 mp3 声音流合并到一个文件并在 <audio> 标签中播放

Web Audio API 如何命名声音

使用 Web Audio API 将两个声音分配给两个 Div,并通过带有 javascript 的 click 事件独立播放

Web 播放声音 — AMR(Audio) 篇

js/jquery点击按钮循环播放声音

录制使用 javascript 播放的声音