HTML5 视频无法在 Firefox 中播放

Posted 2023-03-15

【中文标题】HTML5 视频无法在 Firefox 中播放

【英文标题】：HTML5 video not playing in Firefox

【发布时间】：2013-03-17 09:26:19

【问题描述】：

我已将文件转换为三种不同的格式：mp4、web 和 ogv。根据caniusefirefox 应该支持 ogg 和 webm，但没有播放。

我使用Miro Converter 转换了文件，据其他人说这应该可以正常工作。我相信 Chrome 会选择 webm 文件（如果我右键单击 -> 在新选项卡中打开，它会显示 webm 文件），这很棒。

网站网址：http://dev.fristil.se/hbh/

我有一张静态图片作为背景。视频应该显示在它上面，所以如果它没有移动，你可以判断它没有工作。

有什么想法吗？

【参考方案1】：

您的服务器没有为文件发送正确的 mime 类型。

发送Content-Type: text/plain

html5 视频可以在 Safari、Chrome 和 IE 9 中播放，但不能在 Firefox 或 IE 7-8 中播放。如果您修复 MIME 类型的问题，它将在 Firefox 中播放。

如果您使用的是 Apache Web 服务器或 Apache 的一些衍生产品，您可以在站点范围的 httpd.conf 或 .htaccess 中使用 AddType 指令> 存储视频文件的目录中的文件。 （如果您使用其他 Web 服务器，请查阅您服务器的文档以了解如何为特定文件类型设置 Content-Type HTTP 标头。）

AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm

AddType audio/mpeg .mp3
AddType audio/ogg .ogg
AddType audio/mp4 .m4a
AddType audio/wav /wav

你也有同样的问题：Video file .ogv plays locally in Firefox, but not from server 更详细的答案：https://***.com/a/6145629/1081079

【讨论】：

谢谢你，为 Firefox 修复了它！但是，我仍然遇到支持 mp4 的 IE9-10 的问题。它根本不玩。关于可能导致这种情况的任何其他想法？ 编辑：通过将type="video/m4v" 更改为mp4 而不是m4v 使其在IE9 中工作，但IE10 仍然没有移动！

我刚刚在 IE10 中打开了您的网站，它正在运行。我看到熊冒泡，当我保存它时，它是 MPEG-4 视频格式。控制台说你有 HTML1508: Unmatched end tag。在第 209 行。尝试纠正它。

这很奇怪，browserstack 给了我 IE10 中的静止图像。你是如何测试的？我来看看不匹配的标签。

通过使用 .htaccess 文件中的 AddType 为我修复了 IE 11 问题，加油 Freshbm，你这个男人！

如果用apache，那nginx呢？

【参考方案2】：

您的问题是服务器端的。服务器实际上返回 text/plain 作为视频的 MIME 类型（至少是 .ogg ）。您需要调整服务器的配置以返回正确的 MIME 类型，以便 Firefox 可以正确识别该文件。这与此处描述的问题相同：no video with supported format and MIME type found. What does this mean and how can I change this（您只是看不到该消息，因为您的<video> 标记中没有controls 选项）。

【参考方案3】：

您的服务器交付资源 http://dev.fristil.se/hbh/wp-content/themes/skal/images/video/bubblybeer.webm 和 HTTP 标头 Content-Type: text/plain - 因此 Firefox 拒绝将其视为其他任何东西。

“教导”您的服务器传送诸如video/webm 之类的内容。

（您的 ogv 也是如此 - 您的服务器还说资源将是文本，应该是 video/ogg。）

【参考方案4】：

我在使用 Flowplayer HTML5 播放器时遇到了与 webm 相同的问题。 Firefox 说“找不到 HTML5 视频”。起初我以为是 Miro 有编码问题，我尝试了几个不同的程序，结果都一样。所以我把它缩小到我的服务器上不正确的 MIME 类型，将 webm 传输为 text/plain（你可以使用 web 检查器来查看）或者 Firefox 只是很糟糕。不久前我有托管服务提供商 AddType video/webm .webm，所以我不能肯定。在意识到我过去使用过 Flowplayer 并且只需要一个 mp4 文件之后，我所做的只是直接从我的 HTML 中删除了 webm 引用。火狐可以使用 mp4。删除这个：

 <source type="video/webm" src="URL_to_webm.webm" />

这使它适用于所有设备（IE、Chrome、Firefox、iPad、iPhone）。 Mac 上的 Chrome 29 使用 mp4。

【参考方案5】：

我的 Windows 主机也遇到了同样的问题。为了解决这个问题，我在 web.config 中包含了 mime 设置

<staticContent>
  <mimeMap fileExtension=".webm" mimeType="video/webm" />
</staticContent>