静音的自动播放视频显示错误：play（）失败，因为用户没有首先与文档进行交互。

Question

我正在尝试在页面的弹出窗口中自动播放HTML5视频（处于静音状态）。加载页面时，弹出窗口是隐藏的。当用户尝试跳出页面时（从顶部开始），它会显示带有自动播放和静音打开功能的视频弹出窗口。然后，我尝试使用JavaScript播放视频，但出现此错误：play() failed because the user didn't interact with the document first.

如果我单击页面上的某处或在显示视频弹出窗口之前打开开发人员面板，则效果很好。我使用的是Flow Player，并且仅在Google Chrome中运行（在FF上运行正常）。

请问您如何解决这个问题？

谢谢J

Answer 1

Google Chrome浏览器已更新了自动播放政策。 URL for reference

根据新行为：

1. 始终允许静音的自动播放。
2. 在以下情况下，允许自动播放声音：
   • 用户已与域进行了交互（单击，点击等）。
   • 在台式机上，已超过用户的“媒体参与度索引”阈值， 表示用户以前曾播放带声音的视频。
   • 在移动设备上，用户已将该网站添加到他或她的主屏幕中。
3. 顶部框架可以将自动播放权限委派给其iframe，以允许自动播放声音。