使用；Gifs“；在Safari和IOS中：视频获胜'；自动播放

我们不使用真正的GIF，而是使用循环的mp4视频（以节省加载时间）

然而，Safari拒绝自动播放视频，即使自动播放循环静音播放线

有没有一种方法可以创建不需要大文件大小且可以在移动设备中自动播放的循环视频/GIF

我的视频标签看起来像：

<video preload autoplay="autoplay" muted="true" playsinline="true" loop>
            <source src= 'https://sample-videos.com/video123/mp4/720/big_buck_bunny_720p_20mb.mp4'>
                Your browser does not support video tag
</video>

---

有没有一种方法可以在Safari中自动播放视频，或者其他最佳实践方案？

您的HTML5实际上可以在不同的源视频中正常工作-在Mac OSX 10.14.5上的Safari 12.1.1中运行以下内容：

您的浏览器不支持视频标记

谢谢，但它在iOS中不起作用。最新的iOS似乎不再允许自动播放。@自动-是iOS有不同的规则，但如果满足条件，它仍应自动播放，请参阅更新以回答。我也不工作，通过WebRTC接收媒体流。我已经在video元素上设置了这些属性，在添加新的MediaStream之前，我还使用js再次设置了这些属性，该MediaStream仅使用receiverds stream中的第一个video mediastrack创建。元素。play（）也是rejected@netizen-片段中的源视频似乎有问题，因此我对其进行了更改并再次验证。如果在Safari上运行，上面的代码段现在应该可以工作了。如果您的意思是您自己的示例不起作用，那么可能需要发布一个特殊的问题来解释WebRTC交互，如果您能够的话，还可以共享链接。我不能发布该代码，但场景就像这里有一个伪URL，允许您查看我们的流，单击它将发送一条websocket消息，如果获得批准，该消息将启动webrtc协商，并在收到流事件的对等连接上结束。该流在本地用于创建视频元素（在html和js中设置了所有四个属性），将该流分配给srcObject并尝试播放。我改变了很多事情的顺序，比如在DOM中已经有了视频元素等等。只有iOS中的Safari拒绝播放，所以我们在需要时添加了播放按钮。

 <video preload autoplay muted playsinline loop>
                <source src= 'https://sample-videos.com/video123/mp4/720/big_buck_bunny_720p_20mb.mp4'>
                    Your browser does not support video tag
    </video>

if (/* user scrolls to div */){
   document.getElementById('my-video').play();
}