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

Question

根据 Post from 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' post 切换到 youtube 解决方案.现在它正在他的 IE8 上播放(万岁!)。但是新的问题出现了。无法在他的 iPad 上播放该视频。可能他禁用了他的 YouTube 应用程序。

我也尝试过使用我的 iPad。令人惊讶的是，它也没有奏效(令人震惊!)。

---

问题:

在网站上播放视频的最佳方式是什么？可能不是 100% 无故障的解决方案，但可以在大多数情况下发挥作用。

标准:

• 自动播放
• 跨浏览器(包括 Android 的默认浏览器)
• 拒绝现成的插件/播放器
• 大型视频文件(50MB 以上)

Answer 1

没有单一的方法可以跨浏览器。

First, there is not a single HTML5-video-codec that works on all browsers

其次，IE8不支持HTML5，所以没有Flash等现成的插件/播放器是不行的

第三，你不能只在所有设备上使用 Flash，因为这在 Apple iMonopolyPad 和 iHegemonyPhone 上不起作用，因为 apple 不允许这样做，因为他们 a) 想销售 Quick-Time 视频 b)不想要竞争性的 adobe-appstore 在他们自己的平台上比他们自己的好得多，因为这会削减他们的利润率。

YouTube 视频并非全部转换为非 Flash HTML5 视频格式，并且每个 youtube/google 帐户可能会禁用 HTML5 视频。

所以，如果你想嵌入它，你最好使用 jQuery 插件。然后您可以声明一个具有宽度和高度的 div、一个类和视频 URL 的数据属性，jQuery 将 div 替换为适合每个浏览器的 HTML5 视频标签，或 IE8 中的 Flash。

最接近您愿望的是this :

<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>

babylonian codec & resolution plage 的一个很好的格式转换器是这个:
http://www.mirovideoconverter.com/

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