AudioContext 没有暂停属性？

Question

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

这是我的代码：

<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>

执行以下操作：

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