首页
编程随笔
Java笔记
Html/Css/Js
Android
后端笔记
服务器搭建
BUG收集
Java异常
Android异常
在线工具
Json格式化
编码/解码
Epub在线编辑
登录
发布文章
个人文章
退出登录
首页
技术教程
BUG收集
在线工具
资源下载
登录
发布文章
退出登录
搜索
当前位置：
首页
-
博客
- 正文
关闭
failed because the user didn‘t interact with the document first
更新时间：2022-11-09 22:41:32
阅读数：680
发布者：落幕
Uncaught (in promise) DOMException: play() failed because the user didn’t interact with the document first. https://goo.gl/xX8pDD 报这个错是因为 在最新版的Chrome浏览器（以及所有以Chromium为内核的浏览器）中，已不再允许自动播放音频和视频。就算你为video或audio标签设置了autoplay属性也一样不能自动播放 这是因为，Chrome只允许用户对网页进行主动触发后才可自动播放音频和视频。其实，严格地来说，是Chrome不允许在用户对网页进行触发之前播放音频，而视频其实是不受限制的。但因为视频文件同样包含了音频，所以也一同被禁止了。Chrome这样做的目的是为了防止开发者滥用自动播放功能而对用户产生骚扰。 既然知道了原因，那就开始找解决方法。 比较常规的做法是，为video标签设置muted属性，使它静音，这样视频就能自动播放了，但是没有声音: 复制内容到剪贴板程序代码 ```html <video id="music" width="1px" src="xxx.mp4" autoplay muted></video> ``` 然后待用户在网页上有了任意触发后，再将muted去掉，或者让用户手动去打开音频（腾讯视频就是这样做的）： ##### 复制内容到剪贴板程序代码 原生js ```javacript document.body.addEventListener("mousedown", function(){ var vdo = document.getElementById("music"); //jquery vdo.muted = false; }, false); ``` jquery ```javacript document.body.addEventListener("mousedown", function(){ var vdo = $("video")[0]; //jquery vdo.muted = false; ```
