Question

我的硬盘上有不同格式的视频，我想在html页面中显示，例如截至目前我有.mp4和.flv视频格式=并尝试使用以下html代码显示

<div style="padding-top:90px;">
  <video id="vid" width="350" height="250" controls="controls">
           <source src="/home/user/videos/django_cms_1280x720.mp4" type="video/mp4" />
   </video>
  <video id="vid_re" width="350" height="250" controls="controls">
           <source src="/home/user/videos/1100000.flv" type="video/mp4" />       
   </video>
</div>

因此，当在浏览器中呈现/打开html页面时，django_cms_1280x720.mp4视频播放没有问题，但1100000.flv没有播放.......

有谁能告诉我如何在html页面上显示和播放不同格式的视频？

被修改

由于html不支持.flv个视频，我已将它们转换为mp4并编辑了如下代码，但仍然无法播放视频，该页面只显示视频的空白图像

  <video id="vid_re" width="350" height="250" controls="controls">
           <source src="/home/user/videos/1100000_cnvtd.mp4" type="video/mp4" />       
   </video>

Answer 1

不支持FLV作为浏览器播放的本机格式。您必须使用插件在您的网站上播放flv。

您可以尝试：

http://flowplayer.org/

Answer 2

根据评论讨论，我认为我有足够的数据来回答您的问题：

最初，您的问题视频的扩展名为.flv。这很可能是兼容HTML5的浏览器无法处理的格式（我说'很可能'因为它很可能是一个文件扩展名不正确的正确文件;文件扩展名会触发错误的MIME类型发送通过Web服务器响应可能会混淆某些浏览器。）
您的快速概念验证视频转换功能不足。 ffmpeg -i v1.mp4 v2.mp4将生成一个包含MPEG-4第2部分视频的.mp4文件，HTML5兼容的浏览器通常不支持该文件。您需要确保视频采用H.264格式。

因此，一般来说，请确保您的视频属于您的投放机制定义的相当严格的约束。在这种情况下，HTML5视频标签需要具有H.264视频和AAC音频的MP4文件。

在html页面中显示不同格式的视频

2 个答案: