javascript - 视频标签现在在 Safari 中不起作用

Question

下面的代码使视频标签在 IE9、Chrome 和 Firefox 中工作。但是我无法让它在 Safari 中工作

<video width="400" height="300" controls="controls" poster="ContractorTestingVideos/cntrtest1.jpg">
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/ogg; codecs='theora, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/webm; codecs='vp8, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.m4v" type="video/x-m4v"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.mp4" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"></source>
</video>

所以对于 Safari，我试过这个，

<video width="400" height="300" controls="controls" poster="ContractorTestingVideos/cntrtest1.jpg" src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.mp4"></video>

还是不行。我确实将 url 直接粘贴到 Safari 地址栏中，它确实带回了视频并播放了它。

关于如何让 html5 视频标签在 safari 中工作的任何想法？ 我的 Safari 版本是 5.0.5(7533.21.1)，我在 64 位虚拟机上工作，操作系统是 Windows 7

Answer 1

尝试重新排列您的视频源列表，让您的 .mp4 视频排在第一位。出于某种原因，如果不这样做，我就无法让视频在 Mobile Safari 上播放，而且很少在桌面 Safari 上播放。

像这样:

<video width="400" height="300" controls="controls" poster="ContractorTestingVideos/cntrtest1.jpg">
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.mp4" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/ogg; codecs='theora, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/webm; codecs='vp8, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.m4v" type="video/x-m4v"></source>
</video>