Javascript HTML5视频不在chrome中加载，但在开发人员控制台打开时工作

我正在为一个客户端开发一个web应用程序，HTML5视频标签有一个问题

问题是视频不会加载到chrome中，但可以在Safari、Firefox和IE上运行

所以我开始在chrome中调试，但我发现如果我在打开控制台的情况下刷新页面，视频就会加载。但当我关闭控制台并刷新时，视频将无法加载

以下是我尝试过的几件事：

在mp4和webm中有多种类型的视频。 在componentDidMount中，用相同的代码替换视频

但似乎都不管用

<div class="Top">
    <div class="video-container BGVideo">
        <video id="videobg" class="video-background" preload="true" loop="" autoplay="" poster="/img/azzura.jpg">
            <source src="/img/azzura.mp4">
            <source src="/img/azzura.webm">
        </video>
        <div class="video-overlay"></div>
        <div class="video-content">
            <div class="BGContent">
                <div class="scrollDown">
                    <a class="button"><i class="fa fa-chevron-down"></i></a>
                </div>
            </div>
        </div>
   </div>
</div>

---

这对我来说很有效

已完成的参数

loop=“false”

和

autoplay=“false”

已清空，例如

loop=”“

等

我发现我的问题是我启用了自动播放，但根据chrome的新政策，除非视频静音，否则不允许自动播放，因此，添加静音属性可以解决问题。

显示您的代码…可能的解决方案：打开

开发人员控制台

>按

F1

>滚动到

网络

>检查

禁用缓存（当DevTools打开时）

。代码中可能存在一些缓存问题。如果没有额外的代码，我们将无法提供帮助。这些属性属于布尔类型。这意味着它们存在时是真的，如果不存在则是假的

loop=“false”

在有效的html/浏览器中将循环设置为

true

，而不是

false

。