Chrome中HTML video标签autoplay点击刷新无效,如何解决?
问题原因与解决方案
这个问题是Chrome浏览器的自动播放政策限制在搞鬼。从Chrome 66版本开始,浏览器对带音频的媒体自动播放做了严格限制——只有满足特定条件,带声音的视频才能自动启动:
- 用户已经和页面有过交互(比如点击、滚动操作)
- 视频本身被设置为静音状态
- 站点被用户手动加入自动播放白名单
你当前的代码里没有给视频加静音属性,所以Chrome在普通刷新(点击刷新按钮)时,会判定页面没有用户主动交互,直接阻止自动播放;而硬刷新(F5/Ctrl+F5)时可能因为缓存或会话的特殊状态暂时绕过了限制,但这不是稳定的解决办法。
修复方法
给video标签加上muted属性就行,修改后的代码如下:
<video autoplay loop controls muted> <source src="http://136.243.19.144/v/230518/4XFq546l.mp4" type="video/mp4"/> </video>
加上muted后,视频会以静音状态自动播放,完全符合Chrome的自动播放规则,不管是普通刷新还是硬刷新,都能正常自动播放了。
内容的提问来源于stack exchange,提问作者C0x




