b站之类的视频网站是怎么让video播放器自动播放的？

Question

按照chrome的规则，视频或者音频是不能在用户未主动操作前，进行播放。

那这些视频网站是怎么实现自动播放的呢？

Answer 1

老生常谈的问题了：

斗鱼、B站是怎么解决 Chrome 禁止自动播放的问题的？

Answer 2

Chromium 和 Chrome 系列浏览器针对自动播放策略的大致如下：

Chrome's autoplay policies are simple:

Muted autoplay is always allowed.

• Autoplay with sound is allowed if:

  • The user has interacted with the domain (click, tap, etc.).
  • On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound.
  • The user has added the site to their home screen on mobile or installed the PWA on desktop.

• Top frames can delegate autoplay permission to their iframes to allow autoplay with sound.

简单翻译摘要：

• 内容是静音的，或者没有音频（仅视频）；
• 用户在浏览会话期间在网站上点击了某个位置；
• 在移动设备上，如果用户将网站添加到主屏幕；
• 在桌面上，如果用户经常在该网站上播放媒体内容，根据媒体参与指数。

• Autoplay
• Autoplay policy in Chrome - Chrome Developers

---

对于 Bilibili 这种多为 Media Engagement Index 这一条，简单的说，当你在这个域名下的媒体交互指数超过一定阈值后，就可以自动播放，但对于播放媒体也有一些限制。

• Consumption of the media (audio/video) must be greater than seven seconds.
• Audio must be present and unmuted.
• The tab with the video is active.
• Size of the video (in px) must be greater than 200x140.

翻译：

• 媒体（音频/视频）的播放时长必须大于七秒。
• 音频必须存在且未静音。
• 包含视频的标签页必须是活动状态。
• 视频的尺寸（以像素为单位）必须大于 200x140。

Answer 3

因为默认情况下 Chrome 是允许自动播放的：

如果你禁止自动播放，那么网页是无法突破这一限制的：

Answer 4

因为 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/vid... Video 标签可以通过设置 autoplay 属性来控制是否自动开始播放，或者通过 JS 手动修改 autoplay 属性值