我正在尝试自动播放html5,css,angular5中的视频背景,但是它的工作方式是随机的,而不是正常的。
所以我试图在代码中包含在页面加载时播放的角度代码,它抛出-Uncaught(promise)DOMException:play()
我尝试过像这样检查stackoverflow相同的错误。我已经以多种方式应用了这些解决方案来解决此问题。仍然会引发错误。
component
=========
@ViewChild('videoPlay') videoplay: ElementRef;
videopl: HTMLVideoElement;
//first i tried this. Still throwing error
this.videoplay.nativeElement.play();
//second i tried this still throwing error.
const playPromise = this.videoplay.nativeElement.play();
if (playPromise !== null){
playPromise.catch(() => { this.videoplay.nativeElement.play(); })
}
//third i tried this still throwing error.
this.videopl=this.videoplayer.nativeElement;
this.videopl.play();
html part
=========
<!--first try-->
<video id="videoid" autoplay muted loop preload
poster="img.png" #videoPlayer>
<source src="video.mp4" type='video/mp4' >
<source src="video.webm" type="video/webm">
<source src="video.ogg" type="video/ogg">
</video>
<!--second try-->
<video id="videoid" autoplay="true" muted="muted" loop preload
poster="img.png" #videoPlayer>
<source src="video.mp4" type='video/mp4' >
<source src="video.webm" type="video/webm">
<source src="video.ogg" type="video/ogg">
</video>
<!--third try-->
<video id="videoid" autoplay="autoplay" muted="muted" loop preload
poster="img.png" #videoPlayer>
<source src="video.mp4" type='video/mp4' >
<source src="video.webm" type="video/webm">
<source src="video.ogg" type="video/ogg">
</video>
需要自动播放视频,而不会出现任何错误。
答案 0 :(得分:0)
此解决方案适合我自动播放,位于此处=> https://stackoverflow.com/a/52980364/5755872
<video id="videoid" autoplay muted loop preload
poster="img.png" oncanplay="this.play()" onloadedmetadata="this.muted = true">
<source src="video.mp4" type='video/mp4' >
<source src="video.webm" type="video/webm">
<source src="video.ogg" type="video/ogg">
</video>
我只需要自动播放视频。因此,我删除了播放功能组件中的所有行。
“未捕获(承诺中)DOMException:play()”-这个问题我找不到任何解决方案。但是我也将尝试为该错误找到解决方案。
感谢您阅读此问题。