web-dev-qa-db-ja.com

オーディオファイルを再生すると「Uncaught（in promise）」が返されますが、コンソールでは機能します

オーディオファイルを再生しようとしています（多くのことを試しました）。それらはすべて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()

サウンドは想定どおりに再生されます。

最初のコードスニペットの3行目を次のようにコメントしても：

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

編集：

人々が解決策を知らなくても、エラーを再現できるかどうかを知りたいと思っています。

編集2：

ちなみに、この問題はFirefoxまたはSafariでは持続しません。

javascripthtml5asynchronousaudiohtml5-audio
10
PolymorphismPrince

例外に関連する完全なエラーメッセージを読むと、より適切な説明が得られます。

promise未取得（約束）DOMException：play（）は、ユーザーが最初にドキュメントを操作しなかったために失敗しました。 https://goo.gl/xX8pDD

Googleの記事「 自動再生ポリシーの変更 」（上記のメッセージにリンク）で状況を詳細に説明しています。

短いバージョンは次のとおりです。オーディオまたはビデオを再生する場合は、ユーザーがページ上の何かをクリックするまで待機する必要があります。

20
duskwuff