Question

当我使用AudioBufferSourceNode播放音频时，是否可以在其之前添加其他节点（增益或平移或可能的其他节点）在播放中没有间隙或跳跃？规格中是否提到了这一点？有人对此有任何经验吗？

// Play audio
var source = context.createBufferSource();
source.buffer = someBuffer;
source.connect(context.destination);
source.start();

// Later, when source is still playing, is this safe?
source.disconnect();
source.connect(gain);
gain.connect(context.destination);

// And removing nodes is safe too?
gain.disconnect();
source.disconnect();
source.connect(context.destination);

我知道我可以根据需要重新安排节点，但是我的问题是在实际播放期间重新安排。

Answer 1

我没有检查规格，但是从测试来看，实现方式确实有所不同...

当完全断开连接时，Chrome和Safari将暂停AudioBufferSourceNode的播放，而Firefox将使其保持运行状态。

const ctx = new(window.AudioContext || window.webkitAudioContext);
let source;
let connected = true;

btn.onclick = e => {
  btn.textContent = 'loading...';
  btn.disabled = true;
  fetch('https://upload.wikimedia.org/wikipedia/commons/2/23/Turdus_fuscater_-_Great_Thrush_XC243229.mp3')
    .then(r => r.arrayBuffer())
    .then(buf => ctx.decodeAudioData(buf))
    .then(audioBuf => {
      source = ctx.createBufferSource();
      source.buffer = audioBuf;
      source.onended = e => console.log('done');
      source.connect(ctx.destination);
      btn.onclick = e => {
        source.start(0);
        btn.onclick = switchConnect;
        btn.textContent = 'switch connection';
      };
      btn.textContent = 'play';
      btn.disabled = false;
    });
};

function switchConnect() {
  if (connected)
    source.disconnect();
  else
    source.connect(ctx.destination);
  connected = !connected;
}

<script src="https://cdn.jsdelivr.net/gh/mohayonao/promise-decode-audio-data@eb4b1322113b08614634559bc12e6a8163b9cf0c/build/promise-decode-audio-data.min.js"></script>
<button id="btn">fetch</button>

现在，即使播放不暂停，您也可能会遇到一些咔嗒声。这甚至就是为什么AudioNode.disconnect() has been extended to allow for a destination parameter的原因，它使我们可以微调我们要断开连接的目的地，而不是与其他地方断开连接。

因此，您只需将节点首先连接到新目的地，然后将其与先前的目的地断开连接即可。这样可以消除明显的咔嗒声和弹出声，以及Webkit的播放暂停。

但是请注意，从我测试过的所有浏览器来看，所有浏览器仍然不支持此选项，Chrome和Firefox则支持，而Safari则不支持。由于在不支持该功能的浏览器中，调用disconnect(destination)实际上会使其与所有的目的地断开连接，因此我们必须在代码中处理这两种情况。

let supportFineDisconnect = false;
const ctx = new(window.AudioContext || window.webkitAudioContext);
const osc = ctx.createOscillator();
const gain = ctx.createGain();

// lazy checks support for AudioNode.disconnect(destination)
try {
  osc.disconnect(osc);
} catch (e) {
  supportFineDisconnect = "maybe";
}

btn1.onclick = begin;
onchange = switchRoute;

function begin(){
  osc.connect(gain);
  gain.connect(ctx.destination);
  gain.gain.value = 1;

  osc.start(0);

  btn1.textContent = 'stop';
  btn1.onclick = e => osc.stop(0);
}

function switchRoute() {
  if (!supportFineDisconnect) { // might click
    osc.disconnect(); // disconnect from all
  }
  if (+document.querySelector('input:checked').value) {
    connectDirect();
  } else {
    connectGain();
  }
}

function connectDirect() {
  // first connect to new dest
  osc.connect(ctx.destination);
  if (supportFineDisconnect) {
    osc.disconnect(gain); // then disconnect only from gain
  }
}

function connectGain() {
  // first connect to new dest
  osc.connect(gain);
  if (supportFineDisconnect) {
    osc.disconnect(ctx.destination); // then disconnect only from main
  }
}

<button id="btn1">start playing a 440hz osc</button>
switch: <input type="radio" checked value="0" name="switch"><label>through gain</label>
<input type="radio" value="1" name="switch"><label>direct</label>

但是，当然，这仍然不能防止其他因素（例如，收益变化或其他因素）引起的点击或爆裂。

重新安排音频节点时是否可以保证无缝播放？

1 个答案: