Chromeブラウザで自動音声再生を実装する方法

Question

オーディオの自動再生は、Mozilla、Microsoft Edge、および古いバージョンの Google Chrome で機能しますが、自動再生ポリシーの変更により、Google Chrome 67 では自動再生できません。

自動再生がブロックされています (リンクされたブログ投稿で指定されている特定のセッション条件が満たされるまで)。 Google Chrome 67でオーディオ自動再生を実装するにはどうすればよいですか?

Answer 1

解決策 #1

私の解決策は、iframe

を作成することでした リーリー Chrome 以外のブラウザの

および audio タグ

リーリー

そして私のスクリプト

リーリー

解決策 #2:

@Leonardによると、別の解決策があります

最初の読み込み時に自動再生をトリガーするためだけに、何も再生しない iframe を作成します。

リーリー

優れた MP3 ファイル ソース: silence.mp3

その後、実際のオーディオ ファイルを簡単に再生します。

リーリー

個人的には、ソリューション #2 の方がクリーンなアプローチであり、JavaScript への依存度が低いため、これを好みます。

2019年8月更新

解決策 #3

代わりに、<embed>

を使用できます。

Firefox オーディオの自動再生が機能しているようです。同時に実行される 2 つのオーディオが作成されるため、<embed> 要素は必要ありません。

リーリー

オーディオに切り替えイベントがある場合は、作成した <embed> 要素を必ず削除してください。

注: 切り替え後は、<embed> が削除され、<audio> 要素が再生されるため、最初から開始されます。通常は 。

リーリー

次に、これらの <audio> および <embed>要素を必ず非表示にしてください

リーリー

注: diplay: none および visibility: hidden では、<embed> 要素が機能しなくなります。