标签：javascript google-chrome video html5-video

我收到错误消息..

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

..当尝试使用Chrome版本66在桌面上播放视频时.

我找到了一个在网站上自动开始播放的广告,但使用以下HTML：

<video
    title="Advertisement"
    webkit-playsinline="true"
    playsinline="true"
    style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
    src="http://ds.serving-sys.com/BurstingRes/Site-2500/Type-16/1ff26f6a-aa27-4b30-a264-df2173c79623.mp4"
    autoplay=""></video>

因此,绕过Chrome v66的自动播放拦截器非常简单,只需将webkit-playsinline =“true”,playsinline =“true”和autoplay =“”属性添加到< video>即可.元件？对此有任何负面影响吗？

解决方法:

要在chrome 66更新后使html 5元素上的自动播放工作,您只需将muted属性添加到视频元素即可.

所以你当前的视频HTML

<video
    title="Advertisement"
    webkit-playsinline="true"
    playsinline="true"
    style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
    src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
    autoplay=""></video>

只需要静音=“静音”

<video
    title="Advertisement"
    style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
    src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
    autoplay="true"
    muted="muted"></video>

我相信chrome 66更新试图阻止标签在用户标签上创建随机噪音.这就是为什么静音属性使自动播放再次起作用的原因.

标签：javascript,google-chrome,video,html5-video
来源： https://codeday.me/bug/20190918/1810609.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。