Safari 不想自动播放视频。如何解决这个问题？

Question

我已经尝试了几乎所有方法，但找不到如何在网页开头制作 Safari 自动播放视频的解决方案。

<script>
	
		   var loopCount = 0;

		   document.getElementById('bgvid').addEventListener('timeupdate', function () {
		   	if (this.currentTime == 0)
		   	++loopCount;
		   	if (loopCount == 20)
		   	this.pause();
});

</script>

<script>
	
var promise = document.querySelector('#bgvid').play();

if (promise !== undefined) {
    promise.catch(error => {
        // Auto-play was prevented
        // Show a UI element to let the user manually start playback
    }).then(() => {
        // Auto-play started
    });
}

</script>

<script>	
	
	
	document.addEventListener('keydown', function(e) {
		if (e.keyCode == 113) {
			document.getElementById('bgvid').pause();
		}
	});
	
	document.addEventListener('keydown', function(e){
		if (e.keyCode == 112) {
			document.getElementById('bgvid').play(); 
		}		
	});
</script>

         
<!--------- Script Video End ---------->

#bgvid {
	object-fit: cover;
}

.video-container {
      position: absolute;
      width: 100%;
      height: 100vh;
      overflow: hidden;
}

video {
      object-fit: cover;
      width: 100vw;
      height: 100vh;
      position: absolute;
      top: 0;
      left: 0;
}

.video-container::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      background: #1b1b1b;
      opacity: 0.8;
}

      <a id="home"></a>
      <div class="wrapper">


            <!--------------- hero section starts here --------------->

            <div class="video-container">
	            
                  <video preload="metadata" poster="/img/prevideo1.jpg" autoplay   muted="true" loop playsinline id="bgvid">
                   
                    <source src="videobg%20-%20converted%20with%20Clipchamp.webm" type="video/webm" alt="Your browser does not support the video tag.">
                   
                   <source src="videobg.mp4" type="video/mp4" alt="Your browser does not support the video tag."> 
                    
					<p>Your browser does not support the video tag.</p>  
					    
                  </video>
            </div>

这里是页面链接：http://avelitest.epizy.com/index.html

但是，在 Chrome 中一切正常。我只是不明白它有什么问题。感谢您的帮助！）

Answer 1

“Safari...使用自动推理引擎来阻止大多数网站默认自动播放带有声音的媒体元素。”

https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/