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

The best way to play videos on website

本文关键字：最佳 方式 视频 播放 网站      更新时间：2023-09-26

根据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，它确实失败了。我可以告诉他升级他的浏览器，但这并不适用于所有浏览网站的用户。

所以我切换到youtube的解决方案，从w3schools的帖子。现在它在他的IE8上播放(万岁!)但是一个新的问题出现了。视频无法在他的iPad上播放。可能他的youtube应用被禁用了。

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

问题:

在网站上播放视频的最佳方式是什么?也许不是100%无故障的解决方案，但在大多数情况下都有效。

标准:

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

没有一种跨浏览器的方法。

首先，没有一个单一的html5 -视频编解码器适用于所有浏览器

第二，IE8不支持HTML5，所以没有现成的插件/播放器(如Flash)是不可能的

第三，你不能在所有设备上都使用Flash，因为这在苹果的iMonopolyPad上是行不通的。因为苹果不允许这样做，因为他们a)想卖quicktime视频，b)不想有一个竞争对手的adobe应用商店，这将比他们自己的平台要好得多，因为这会削减他们的利润率。

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)实用程序检查您的文件是否实际上是文件扩展名中指定的格式。

相关文章：