Question

我写了一个通知函数，它应该在条件满足时发出警报声并在确认后停止。但音频不播放，只显示确认框。这是我的代码：

    function notify() {
    const alarm = new Audio('link to remote alarm audio');
    alarm.loop = true;
    alarm.play();
    if (confirm('Pause Audio?')) {
        alarm.pause();
    }
}

更新：错误消息 ->“DOMException：play() 失败，因为用户没有先与文档交互”

Answer 1

经过小规模研究，我发现用户需要 interact with document.根据您的用例，如果用户之前与文档进行过交互，那么它会正常工作，不会出现任何错误。
（如果您单击文档正文，则在提示出现之前，您会看到音频播放）。

function notify() {
  const alarm = new Audio('https://freesound.org/data/previews/34/34025_302129-lq.mp3');
  alarm.loop = true;
  alarm.play();
  if (confirm('Pause Audio?')) {
    alarm.pause();
  }
}

notify();

function confirm(msg){   //For Testing Purposes
  return prompt(msg);
}

Answer 2

我做了一些研究，发现 playing audio without user interact is again Google rules。所以在内部切换到 Chrome 之后添加了一个 1 秒的超时时间，以便为音频文件提供足够的加载时间。

<块引用>

使用此代码运行 chrome -> chrome.exe --autoplay-policy=no-user-gesture-required

function notify() {
    const alarm = new Audio('https://audio-link');
    alarm.loop = true;
    alarm.play();
    setTimeout(() => {
        if (confirm('Do you see that?')) {
            alarm.pause();
        }
    }, 1000);
}

Answer 3

尝试设置在 alarm.load() 之前调用 alarm.play()

音频未按预期播放

3 个答案: