自动播放的视频已静音，无法在Safari 11.0中播放 [英] Muted autoplay videos stop playing in Safari 11.0

问题描述

我的网站上有这些视频，这些视频具有以下属性:

I have these videos on my site with attributes listed below:

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

在安装Safari 11之前，一切工作都很好.此版本显示海报图像，即使没有音轨也不会自动播放视频.在我的网站上查看一下.

Everything worked just fine until I’ve installed Safari 11. This version shows poster images and does not autoplay videos even though they don't have an audio track. Take a look at it on my site.

我在自己的Safari笔记本电脑上看到自动播放的视频在其他网站上运行 (即使没有静音属性).

I saw autoplay videos working on other sites (even without muted property) on my own laptop in Safari.

任何帮助将不胜感激！

推荐答案

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

Yup, it appears Safari is also blocking muted video's (that don't even have sound)...

我找到了一种解决方法，但是它并不漂亮，我也不为此感到骄傲:

I have found a workaround, but it isn't pretty and I'm not proud of it:

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拒绝来拒绝此操作. 我不知道为什么...

I have tried doing this without the timeout, but Safari is rejecting this by throwing a Promise rejection. I don't know why...

这篇关于自动播放的视频已静音，无法在Safari 11.0中播放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！