如何修复“未捕获(承诺)的DOMException:play()”

时间:2019-05-15 05:46:02

标签: javascript dom angular5 html5-video

我正在尝试自动播放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>

需要自动播放视频,而不会出现任何错误。

1 个答案:

答案 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()”-这个问题我找不到任何解决方案。但是我也将尝试为该错误找到解决方案。

感谢您阅读此问题。