我正在得到错误信息..
DOMException: play()失败，因为用户没有首先与文档交互。
．．当使用Chrome 66版本在桌面上播放视频时。
我确实发现一个广告开始自动播放在一个网站上，但使用以下HTML:
<video
title="Advertisement"
webkit-playsinline="true"
playsinline="true"
style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
src="http://ds.serving-sys.com/BurstingRes/Site-2500/Type-16/1ff26f6a-aa27-4b30-a264-df2173c79623.mp4"
autoplay=""></video>
那么，绕过Chrome v66的自动播放拦截器真的像添加webkit-playsinline="true"， playsinline="true"和autoplay=""属性<video>元素一样简单吗?这有什么负面影响吗?
我得到了这个错误
DOMException: play()失败，因为用户没有首先与文档交互。
下面是我在Angular项目中所做的
关键点:永远不要假设视频会播放，当视频没有真正播放时，不要显示暂停按钮。
你应该总是查看play函数返回的Promise，看看它是否被拒绝了:
ngOnInit(): void{
this.ensureVideoPlays();
}
private ensureVideoPlays(): void{
const video = document.querySelector("video");
if(!video) return;
const promise = video.play();
if(promise !== undefined){
promise.then(() => {
// Autoplay started
}).catch(error => {
// Autoplay was prevented.
video.muted = true;
video.play();
});
}
}
来源:自动播放策略
根据新的浏览器策略，在播放Audio元素之前，用户必须首先与DOM交互。
如果你想在页面加载中播放媒体，那么你可以简单地添加自动播放属性到HTML中的音频元素，就像这样
<video id="video" src="./music.mp4" autoplay> .
或者如果你不想做自动播放，那么你可以使用Javascript处理这个。由于autoplay属性设置为true，媒体将被播放，我们可以简单地静音媒体。
document.getElementById('video').autoplay = true;
document.getElementById('video').muted = true;
小鬼:现在不管你什么时候播放媒体，别忘了把静音属性设为false。像这样
document.getElementById('video').muted = false;
document.getElementById('video').play();
或者，您还可以显示一个简单的弹出窗口，用户将单击模式中的允许按钮。因此，他首先与DOM交互，然后您不需要做任何事情
