html - 静音自动播放视频在 Safari 11.0 中停止播放

Question

我的网站上有这些视频，其属性如下:

<video width="100%" poster="poster_url.png" autoplay loop muted playsinline>
<source src="video_url.mp4" type="video/mp4">
</video>    

在我安装 Safari 11 之前，一切都很好。此版本显示海报图像并且不会自动播放视频，即使它们没有音轨。看看我的site .

我看到自动播放视频有效 on other sites (即使没有静音属性)在我自己的笔记本电脑上的 Safari 中。

如有任何帮助，我们将不胜感激!

Answer 1

是的，Safari 似乎也在阻止静音视频(甚至没有声音)...

我找到了一个解决方法，但它并不完美，我对此并不感到自豪:

var ua = navigator.userAgent.toLowerCase();
var is_safari = (ua.indexOf("safari/") > -1 && ua.indexOf("chrome") < 0);
if(is_safari) {
    var video = document.getElementById('#video-element-id');
    setTimeout(function() {
       video.play();
    }, 50);
}                       

我曾尝试在没有超时的情况下执行此操作，但 Safari 通过抛出 Promise 拒绝来拒绝此操作。我不知道为什么...