不错呦！smile@林凯西，确保“准备文件”中的几个文件都有安装，S...您好，看了您这篇帖子觉得很有帮助。但是有个问题想请...我的修改过了怎么还被恶意注册呢 @jjjjiiii 用PJ快9年了，主要是A...PJ3啊，貌似很少有人用PJ了，现在不是WP就是z...@332347365，我当时接入时错误码没有-10...楼主，ChkValue值应为-103是什么意思呢？...大哥 你最近能看到我发的信息，请跟我联系，我有个制...
HTML5<video>报错Uncaught (in promise) DOMException解决方法[转]
编辑:dnawo 日期:2019-07-30
在最新版的Chrome浏览器（以及所有以Chromium为内核的浏览器）中，已不再允许自动播放音频和视频。（Google的某些做法还真是令开发者不爽）。就算你为video或audio标签设置了autoplay属性也一样不能自动播放。
如果你用 javascript 代码显式调用play方法：
你将会在控制台看到如下异常：
引用内容
Firefox也有类似的异常提示：
引用内容
这是因为，Chrome只允许用户对网页进行主动触发后才可自动播放音频和视频。其实，严格地来说，是Chrome不允许在用户对网页进行触发之前播放音频，而视频其实是不受限制的。但因为视频文件同样包含了音频，所以也一同被禁止了。Chrome这样做的目的是为了防止开发者滥用自动播放功能而对用户产生骚扰。
既然知道了原因，那就开始找解决方法。
比较常规的做法是，为video标签设置muted属性，使它静音，这样视频就能自动播放了，但是没有声音:
然后待用户在网页上有了任意触发后，再将muted去掉，或者让用户手动去打开音频（腾讯视频就是这样做的）：
好了，我们来看看大厂的解决方案：
优酷页面打开后视频不自动播放，需用户点击按钮才开始播放，B站解决方法和优酷一样，爱奇艺页面打开后视频自动开始播放，但声音需用户手工开启，所以暂时不要去想什么hack的方法了，有办法这些大厂早用了，还是老老实实引导用户手工点一下吧。
复制内容到剪贴板
程序代码
程序代码<video src="YOUR_VIDEO_URL" autoplay></video>
如果你用 javascript 代码显式调用play方法：
复制内容到剪贴板 程序代码
程序代码<video></video>
<script type="text/javascript">
var vdo = $("video")[0]; //jquery
vdo.src = "YOUR_VIDEO_URL";
vdo.oncanplay = function(){
this.play();
};
</script>
<script type="text/javascript">
var vdo = $("video")[0]; //jquery
vdo.src = "YOUR_VIDEO_URL";
vdo.oncanplay = function(){
this.play();
};
</script>
你将会在控制台看到如下异常：
引用内容Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first.
Firefox也有类似的异常提示：
引用内容NotAllowedError: The play method is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
这是因为，Chrome只允许用户对网页进行主动触发后才可自动播放音频和视频。其实，严格地来说，是Chrome不允许在用户对网页进行触发之前播放音频，而视频其实是不受限制的。但因为视频文件同样包含了音频，所以也一同被禁止了。Chrome这样做的目的是为了防止开发者滥用自动播放功能而对用户产生骚扰。
既然知道了原因，那就开始找解决方法。
比较常规的做法是，为video标签设置muted属性，使它静音，这样视频就能自动播放了，但是没有声音:
复制内容到剪贴板 程序代码
程序代码<video src="YOUR_VIDEO_URL" autoplay muted></video>
然后待用户在网页上有了任意触发后，再将muted去掉，或者让用户手动去打开音频（腾讯视频就是这样做的）：
复制内容到剪贴板 程序代码
程序代码document.body.addEventListener('mousedown', function(){
var vdo = $("video")[0]; //jquery
vdo.muted = false;
}, false);
var vdo = $("video")[0]; //jquery
vdo.muted = false;
}, false);
好了，我们来看看大厂的解决方案：
优酷页面打开后视频不自动播放，需用户点击按钮才开始播放，B站解决方法和优酷一样，爱奇艺页面打开后视频自动开始播放，但声音需用户手工开启，所以暂时不要去想什么hack的方法了，有办法这些大厂早用了，还是老老实实引导用户手工点一下吧。
上一篇: HTML5<audio>报错audio.play is not a function解决方法
下一篇: 现浇花瓶柱自制6公分垫片示例
文章来自: nooong.com
引用通告: 查看所有引用 | 我要引用此文章
Tags: 
最新日志:
评论: 0 | 引用: 0 | 查看次数: 152932
发表评论
请登录后再发表评论！
