播放音频文件返回“未捕获（承诺）”但在控制台中工作

Question

我正在尝试播放音频文件（我尝试了很多）。它们都是mp3。 我已经在 MAMP localhost 以及在浏览器中运行它测试了以下内容。

我使用以下 javascript：

var testSound = new Audio();
testSound.src = "a.mp3"
setTimeout(testSound.play.bind(testSound),100)

这会返回错误：

Uncaught (in promise)

试图抓住它：

var testSound = new Audio();
testSound.src = "a.mp3"
setTimeout(playSound,100)
function playSound () {
    testSound.play().then(response => {

    }).catch(e => {
        console.log(e);
    })
}

什么都不返回 ("")

但如果我现在转向控制台并简单地输入：

testSound.play()

声音按预期播放。

即使我将第一个代码 sn -p 的第三行注释为：

//setTimeout(testSound.play.bind(testSound),100)

编辑：

即使人们不知道解决方案是什么，我仍然很想知道他们是否可以重现错误。

编辑 2：

顺便说一句，问题在 Firefox 或 Safari 中不会持续存在。

Answer 1

如果您阅读了与异常相关的完整错误消息，您会得到更好的解释：

❌ Uncaught (in promise) DOMException: play() failed 因为用户没有先与文档交互。 https://goo.gl/xX8pDD

Google 的文章“Autoplay Policy Changes”（链接在上面的消息中）详细解释了这种情况。

简短的版本是：如果要播放音频或视频，则需要等到用户单击页面上的某些内容后才能执行。