javascript - 如何防止 "The play() request was interrupted by a call to pause()"错误？

Question

我制作了一个网站，如果用户点击它，它就会播放声音。为了防止声音重叠，我不得不添加代码:

n.pause();
n.currentTime = 0;
n.play();

但这会导致错误: play() 请求被 pause() 调用中断
每次在另一个触发器之后立即触发声音事件时出现。声音仍然很好，但我想防止不断弹出此错误消息。有什么想法吗？

Answer 1

我最近也遇到了这个问题 - 这可能是 play() 和 pause() 之间的竞争条件。看起来有对这个问题的引用，或者相关的东西 here .

作为@Patrick指出，pause 不返回 promise (或任何东西)，因此上述解决方案将不起作用。虽然 MDN 没有关于 pause() 的文档，但在 WC3 draft for Media Elements 中，它说:

media.pause()

Sets the paused attribute to true, loading the media resource if necessary.

因此，还可以检查超时回调中的 paused 属性。

基于 this great SO answer ，这里有一种方法可以检查视频是否正在(或未)真正播放，因此您可以安全地触发 play() 而不会出错。

var isPlaying = video.currentTime > 0 && !video.paused && !video.ended 
    && video.readyState > video.HAVE_CURRENT_DATA;

if (!isPlaying) {
  video.play();
}

否则，@Patrick的 answer应该可以。