在网站上播放视频的最佳方式

Question

根据w3schools的帖子,在网站上播放视频的最佳方式是使用HTML5以及下面的后备:

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  <object data="movie.mp4" width="320" height="240">
    <embed src="movie.swf" width="320" height="240">
  </object>
Please update your browser. Thanks!
</video>

我尝试使用上面的代码,它适用于Chrome.还有IE9.但是当我的客户向我发送反馈时,他说视频没有在他的IE8浏览器上播放.所以我检查并使用了IE8,它确实失败了.我可以告诉他升级他的浏览器,但这不适用于查看该网站的所有用户.

所以我从w3schools的帖子切换到youtube解决方案.现在它正在玩他的IE8(欢呼!).但是出现了一个新问题.该视频无法在iPad上播放.可能他禁用了他的YouTube应用程序.

我也试过用我的iPad.令人惊讶的是,它没有奏效(令人震惊!).

---

问题:

在网站上播放视频的最佳方式是什么？也许不是100%无故障的解决方案,但在大多数情况下都可以使用.

标准:

• 自动播放
• 跨浏览器(包括Android的默认浏览器)
• 没有现成的插件/播放器
• 大视频文件(50MB +)

Answer 1

这种跨浏览器没有单一的方法.

首先,没有一个HTML5视频编解码器适用于所有浏览器

其次,IE8不支持HTML5,因此如果没有像Flash这样的现成插件/播放器,它是不可能的

第三,你不能只在所有设备上使用Flash,因为这不适用于Apple iMonopolyPad和iHegemonyPhone,因为苹果不能允许它因为a)想要销售Quick-Time视频而b)不要不是一个竞争的adobe-appstore,它会比他们自己的平台好得多,因为这会削减他们的利润空间.

Youtube视频并非全部转换为非Flash HTML5视频格式,并且每个YouTube/Google帐户可能会禁用HTML5视频.

所以,如果你想嵌入它,你最好使用jQuery插件.然后你可以声明一个宽度和高度的div,一个类,以及视频URL的数据属性,jQuery用每个浏览器的相应HTML5视频标签替换div,或者用IE8中的Flash替换.

什么最接近你的愿望是这样:

<video width="640" height="360" controls>
    <!-- MP4 must be first for iPad! -->
    <source src="__VIDEO__.MP4" type="video/mp4" /><!-- Safari / iOS video    -->
    <source src="__VIDEO__.OGV" type="video/ogg" /><!-- Firefox / Opera / Chrome10 -->
    <!-- fallback to Flash: -->
    <object width="640" height="360" type="application/x-shockwave-flash" data="__FLASH__.SWF">
        <!-- Firefox uses the `data` attribute above, IE/Safari uses the param below -->
        <param name="movie" value="__FLASH__.SWF" />
        <param name="flashvars" value="controlbar=over&amp;image=__POSTER__.JPG&amp;file=__VIDEO__.MP4" />
        <!-- fallback image. note the title field below, put the title of the video there -->
        <img src="__VIDEO__.JPG" width="640" height="360" alt="__TITLE__"
             title="No video playback capabilities, please download the video below" />
    </object>

   <track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
   <track src="subtitles_no.vtt" kind="subtitles" srclang="no" label="Norwegian">
</video>

巴比伦编解码器和解析器的良好格式转换器是这样的:http:
//www.mirovideoconverter.com/

并使用GNU文件(libmagic)实用程序检查您的文件是否实际上是文件扩展名中指定的格式.