视频格式或MIME类型不受支持。

Question

这是运行视频的相关代码：

<video id="video" src="videos/clip.mp4" type='video/mp4' controls='controls'>
    Your brwoser doesn't seems to support video tag
</video> 

这段代码单独使用时很好用，但尝试淡入时出现问题：

function showVideoPlayer(){          
    console.log('video displayed');      
    $("#video").fadeIn('medium');
}

这似乎不起作用，我得到了这个：

正如您所看到的：视频格式或MIME类型不受支持。

视频容器被隐藏在CSS中：

#video{
    position:fixed;
    border:solid 1px #000000;
    width:654px;
    height:454px;
    background-color:#FFFFFF;
    left:23%;
    top:11%;
    display:none;
}

这是一个想法，视频容器被隐藏（display:none），需要时，调用函数showVideoPlayer来显示视频容器。然而，在FireFox中出现错误，在Chrome和IE9中出现空白屏幕。

我是否漏掉了什么？fadeIn函数是否有误？

- Malloc

---

你确定视频单独工作正常吗？Firefox不支持mp4格式 - 你需要用单独的webm或ogg/theora视频来支持它。 - TimHayes

它在Chrome和IE9中运行良好。但是，是的，在FF中不起作用。然而，问题不在那里，为什么视频容器淡入时停止工作？谢谢。 - Malloc

我不确定你的确切问题是什么。这个 jsfiddle 在你的浏览器上工作吗？http://jsfiddle.net/aSQ5A/ - TimHayes

虽然您的嵌入方法（使用单个src）是标准的，但TimHayes小提琴中的方法更常用（并经过测试）。我还建议将<video>包装在容器中，并淡化它：http://jsfiddle.net/aSQ5A/1/ - Matt Stone

Answer 1

由于对格式的闭源性持有哲学上的分歧，Firefox目前不支持MPEG H.264（mp4）格式。

为了在所有浏览器中播放视频而不使用插件，您需要在不同格式下托管每个视频的多个副本。您还需要使用另一种形式的video标签，如上面@TimHayes的JSFiddle中所示，下面进行复制。Mozilla声称只有mp4和WebM是确保覆盖所有主要浏览器所必需的，但您可能希望查看W3C的HTML5视频页面上的视频格式和浏览器支持标题，以了解哪些浏览器支持什么格式。

此外，值得查看维基百科上的HTML5视频页面，以便基本比较主要文件格式。

以下是适当的video标签（您需要将视频重新编码为WebM或OGG格式以及现有的mp4）：

<video id="video" controls='controls'>
  <source src="videos/clip.mp4" type="video/mp4"/>
  <source src="videos/clip.webm" type="video/webm"/>
  <source src="videos/clip.ogv" type="video/ogg"/>
  Your browser doesn't seem to support the video tag.
</video>

更新于2013年11月8日

网络基础设施巨头思科宣布计划开源H.264编解码器的实现, 消除迄今为止一直阻碍Mozilla使用的许可费。不深入探讨其中的政治问题（请参见以下链接），这将允许Firefox在“2014年初”开始支持H.264。但是，如该链接中所述，这仍然带有一个警告。H.264编解码器仅用于视频，在MPEG-4容器中，它通常与闭源AAC音频编解码器配对使用。因此，H.264视频的播放将正常工作，但音频将取决于最终用户是否已经在其计算机上安装了AAC编解码器。

长话短说，进展正在取得，但如果不使用插件，仍然无法避免使用多个编码。

- joequincy

Answer 2

在我的情况下，这个错误：

视频格式或 MIME 类型不受支持。

是由于我的 .htaccess 文件中的 CSP 不允许加载内容。您可以通过打开浏览器控制台并刷新页面来检查此问题。

一旦我在 CSP 的 media-src 部分添加了托管视频的域名，控制台就干净了，视频也正常加载了。例如：

Content-Security-Policy: default-src 'none'; media-src https://myvideohost.domain; script-src 'self'; style-src 'unsafe-inline' 'self'

- CPHPython

Answer 3

对于Ubuntu 14.04

只需卸载Oxideqt-dodecs包，然后安装Flash或Ubuntu受限附加组件即可。

然后，您就可以开始了！

- user4156791

Answer 4

搞定了！

这个问题让我快疯了。重置 Firefox，尝试安全模式，移除插件，使用开发者工具进行调试，但都没有用，无法使我的在线视频恢复正常观看状态。然而，下面的方法完美地解决了这个问题。

在 Firefox 或你所使用的任何 Firefox 版本（我最喜欢的是 CyberFox）中，只需浏览到 https://get.adobe.com/flashplayer/。

首先要确认网站检测到你正在使用 FireFox，并已将 Flash Player 的下载设置为 Firefox。

不要直接点击下载。请一定要确保中间标记为“可选提供”的部分绝对没有被勾选，因为默认情况下它会被勾选，所以在下载之前一定要取消勾选。

下载完成后，关闭 Firefox。以管理员身份运行下载的安装文件。它只需要几秒钟就能完成，完成后再次打开 Firefox 并尝试查看之前出现错误的内容。现在应该已经恢复正常了。

享受吧！

- dep

---

安装Flash绝对不是答案。升级到最新版本的Firefox（并卸载Flash！）。 - Alex