我在React中使用video.js。我的问题是视频仅在Chrome中不能正常播放。视频已加载，但不会自动播放。它可以在Firefox，Microsoft Edge甚至Internet Explorer中运行。仅当我打开开发人员工具后，视频才会在Chrome中启动。您曾经遇到过这样的问题吗？我的代码很简单：
<video data-setup='{"loop": true, "autoplay": true, "loadingSpinner": false}'
className="video-js vjs-default-skin article-video">
<source src={this.state.video}/>
</video>
国家根据innerWidth加载不同的视频。
编辑：
静音的属性允许Chrome自动播放视频：
<video muted="muted" data-setup='{"loop": true, "autoplay": true, "loadingSpinner": false}'
className="video-js vjs-default-skin article-video">
<source src={this.state.video}/>
</video>
目前，chrome正在阻止html5视频中的自动播放，因此默认情况下，它们将不允许自动播放。了解更多关于这里的变化...
以下是他们的自动播放政策：
Chrome的自动播放政策很简单：
- 始终允许静音自动播放。
- 在以下情况下，允许自动播放声音：
- 用户已与域进行了交互（单击，点击等）。
- 在台式机上，已经超过了用户的“媒体参与度索引”阈值，这意味着该用户以前曾播放有声视频。
- 在移动设备上，用户已[将该网站添加到其主屏幕]。
- 顶部框架可以将自动播放权限委派给其iframe，以允许自动播放声音。
关于在开发人员工具打开的情况下启用自动播放的原因：含糊地回答了这一问题：
开发人员开关
作为开发人员，您可能需要在本地更改Chrome自动播放策略的行为，以根据用户的参与度来测试您的网站。
您可以通过在chrome：// flags /＃autoplay-policy上将Chrome标志“自动播放策略”设置为“不需要用户手势”来决定完全禁用自动播放策略。这样，您就可以像测试用户强烈参与您的网站一样测试您的网站，并且始终允许播放自动播放功能。
您还可以通过禁用MEI，将自动播放策略应用于Web Audio以及总体MEI最高的站点是否默认为新用户播放自动播放，来确定禁止播放自动播放。这可以通过三个内部开关来完成
chrome.exe --disable-features = PreloadMediaEngagementData，AutoplayIgnoreWebAudio，MediaEngagementBypassAutoplayPolicies。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句