为什么恢复后 Safari 中的 Web Audio 中的状态可能无效？

Question

我有一个代码可以播放从 S3 下载的音频文件。在页面上，用户会看到带有图片和单词的旋转木马，他应该发音并听到正确发音的音频。问题出在 Safari 中，它会在窗口加载时阻止音频文件的自动播放。我知道默认情况下 Safari 会阻止自动播放，并在设置Auto-Play: Stop Media with Sound is enabled。当我进入页面时，Safari 阻止音频文件的自动播放，页面停止加载，并且“freez”和AudioContext 状态为“暂停”，如果在任何用户操作单击文档时调用 resume()，例如，状态更改为“正在运行” '，但如果我点击下一张幻灯片，下一个函数将调用source.stop()如果音频正在播放，则停止音频播放，源是一个bufferSource(AudioContext.createBufferSource())并且它抛出错误'InvalidStateError' 屏幕截图错误

为什么会出现这个错误？如果状态处于“正在运行”而不是“暂停”。在课程中还存在3个按钮再次播放音频，录制音频和播放录制的音频并在恢复所有工作后，但是当停止功能调用时显示错误。

Answer 1

如果您"InvalidStateError: The object is in an invalid state在使用 Safari（或在其他浏览器中显示不同的消息）时AudioBufferSourceNodes看到它，很可能是因为您调用了stop()或start()在已完成播放的节点上。

引用自 MDN：

一个 AudioBufferSourceNode 只能播放一次；每次调用 start() 后，如果您想再次播放相同的声音，您必须创建一个新节点。幸运的是，这些节点的创建成本非常低，并且实际的 AudioBuffers 可以重复用于多次播放声音。实际上，您可以以“即发即弃”的方式使用这些节点：创建节点，调用 start() 开始播放声音，甚至不必费心持有对它的引用。它将在适当的时间自动进行垃圾收集，直到声音播放完毕后的某个时间才会进行垃圾收集。