javascript - AudioContext 没有暂停属性？

Question

我以前使用过 javascript Audio()，但现在我需要在音频中添加一些混响效果，我正在使用使用 AudioContext api 的 reverb.js。我有可用的开始属性，但没有暂停属性？如何暂停或停止音频？？

这是我的代码:

<script src="http://reverbjs.org/reverb.js"></script>
<script>
// 1) Setup your audio context (once) and extend with Reverb.js.
var audioContext = new (window.AudioContext || window.webkitAudioContext)();
reverbjs.extend(audioContext);

// 2) Load the impulse response; upon load, connect it to the audio output.
var reverbUrl = "http://reverbjs.org/Library/SaintLawrenceChurchMolenbeekWersbeekBelgium.m4a";
var reverbNode = audioContext.createReverbFromUrl(reverbUrl, function() {
  reverbNode.connect(audioContext.destination);
});

// 3) Load a test sound; upon load, connect it to the reverb node.
var sourceUrl = "./sample.mp3";
var sourceNode = audioContext.createSourceFromUrl(sourceUrl, function() {
  sourceNode.connect(reverbNode);
});
</script>
<a href="javascript:sourceNode.start()">Play</a>
<a href="javascript:sourceNode.stop()">Stop</a>

此外，我尝试使用 stop()，它有效，但是当我在单击停止后触发 start() 时，start() 不起作用。你能帮我解决一下吗？？

Answer 1

您可以使用AudioContext 的suspend() 和resume() 方法来暂停和恢复您的音频:https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/suspend

用单个按钮实现播放/暂停/恢复的一种方法是添加一个控制播放器状态的函数。例如:

let started = false;
function pauseOrResume() {
    if (!started) {
        sourceNode.start();
        started = true;
        document.getElementById("pauseButton").innerHTML = 'Pause';
    } else if (audioContext.state === 'running') {
        audioContext.suspend().then(function () {
            document.getElementById("pauseButton").innerHTML = 'Resume';
        });
    } else if (audioContext.state === 'suspended') {
        audioContext.resume().then(function () {
            document.getElementById("pauseButton").innerHTML = 'Pause';
        });
    }
}

并将您现有的“播放”按钮替换为:

<a id="pauseButton" href="javascript:pauseOrResume()">Play</a>

这会执行以下操作:

• 如果音频尚未开始，链接将显示“播放”。
• 如果用户点击“播放”，音频将开始播放，链接的文本将变为“暂停”。
• 如果用户在播放音频时点击“暂停”，音频将暂停，链接的文本将变为“继续”。