我遇到过Safari和<compatible-screens>
<!-- all small size screens -->
<screen android:screenSize="small" android:screenDensity="ldpi" />
<screen android:screenSize="small" android:screenDensity="mdpi" />
<screen android:screenSize="small" android:screenDensity="hdpi" />
<screen android:screenSize="small" android:screenDensity="xhdpi" />
<!-- all normal size screens -->
<screen android:screenSize="normal" android:screenDensity="ldpi" />
<screen android:screenSize="normal" android:screenDensity="mdpi" />
<screen android:screenSize="normal" android:screenDensity="hdpi" />
<screen android:screenSize="normal" android:screenDensity="xhdpi" />
</compatible-screens>
元素与较短的高质量视频相关的问题。对于展示网站，我使用<video>元素将12-15秒.mp4和.webm个文件加载到<video>容器中。当试图在Chrome中播放视频时，它可以完美地工作，视频几乎可以立即开始播放，但Safari似乎想要在开始播放之前完全加载视频。
我已经考虑直接通过<source>的{{1}}属性加载视频，并且还添加了src属性以试图强制立即播放。
我已经使用我们在网站上使用的一个视频设置了一个示例，大约8 MB，长12秒：https://jsfiddle.net/n1eac46v/
<video>正如您所看到的，我也在聆听preload="auto"和var video = document.getElementById('video');
var source = document.createElement('source');
source.src = "foo.mp4";
source.type = "video/mp4";
video.appendChild(source);
video.on("canplay canplaythrough", video.play);
事件，但即便如此也无法提供帮助。我连续几天都在寻找这个地方，但现在已经没有选择了。
答案 0 :(得分：0)
我不是OS X用户，所以我没有使用Safari的经验，但是我有机会在Chrome中调试mp4播放。 Chrome有一个缓冲窗口，它会尝试填充，直到它开始实际播放。 Safari可能有更大的窗口。此外，由于在正常情况下所有包含样本位置，持续时间等的表都在文件浏览器的末尾，因此可能希望读取它们以开始播放。智能浏览器可以调度带有字节范围标题的读取以仅获取文件的末尾，然后查找实际的视频数据，但我再次不知道safari的功能。
您可以尝试在视频文件上使用MP4Box将元数据和所有表格移至开头，这可能有所帮助。
正如OP在使用FFmpeg和-movflags faststart（参见FFmpeg MP4 options）的评论中所提到的，也可以用来实现这一点。