如何修复 Chrome 的'play() 失败，因为用户没有先与文档交互”自动播放错误？

处理 Chrome 66 桌面版中的“未捕获（承诺中）DOMException：play() 失败，因为用户没有先与文档交互”错误

尝试使用 Chrome 版本 66 在桌面上播放视频时，用户可能会遇到以下错误message:

Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first.

此错误是由 Chrome 的新自动播放阻止程序引起的，该阻止程序限制在没有用户交互的情况下自动播放视频。要绕过此限制，只需将以下属性添加到

• webkit-playsinline="true"
• playsinline="true"
• autoplay=""

解决方案

启用自动播放Chrome 66 桌面版，必须将 muted 属性添加到 video 元素中。此属性可确保视频开始无声播放，有效满足 Chrome 设置的用户交互要求。

更新了视频 HTML

<video
    title="Advertisement"
    webkit-playsinline="true"
    playsinline="true"
   >

使用的后果“muted”属性

使用 muted 属性有以下效果后果：

• 视频将自动播放，无需用户交互。
• 音频输出将被静音。
• 用户仍然需要与视频交互（例如、切换音量或取消静音）以听到音频。

这种方法允许自动播放，同时仍然提供用户对音频播放拥有必要的控制权，从而减轻与未静音自动播放相关的潜在负面后果。

以上是如何修复 Chrome 的'play() 失败，因为用户没有先与文档交互”自动播放错误？的详细内容。更多信息请关注PHP中文网其他相关文章！