javascript - HTML5 视频无法在任何浏览器中运行

Question

我在这里找到了针对同一问题的其他帖子，例如 this或this但我无法解决我的问题。首先，我运行下面的 javascript:

<script type="text/javascript">
    var options = JSON.stringify({'maxSize': 320, 'videoQuality': 6, 'noaudio': true});
    ogg.encode(options);
</script>

然后我有以下 html:

<video id="video1" width="500" controls="controls" >
    <source src="Rio2Trailer.mp4" type="video/mp4"/>
    <source src="Rio2Trailer.ogv" type="video/ogg"/>
    <source src="Rio2Trailer.webm" type="video/webm" />
    The browser does not support HTML5 video.
</video>

我尝试添加

AddType video/webm .webm
AddType video/mp4 .mp4

到 .htaccess 文件(为空)但没有成功。

在 Firefox 上，我收到消息:

No video with supported format and MIME type found.

在 Chrome 上，我只能看到控件，但它们看起来像是已禁用，而且我也没有在屏幕中间看到播放按钮。

Answer 1

播放 HTML5 视频可能很棘手。有 3 件事需要检查:

• 检查您的 MP4 文件是否已正确编码以进行网络传输。您可以尝试使用handbrake或 MP4Box 或 ffmpeg 来重新打包您的文件。您需要使用手刹激活“网络优化”选项(又名快速启动)。
• 检查您的服务器配置:查看 MIME 类型 here “MIME 类型背后丑陋的头”部分。更改配置后尝试重新启动 Apache 服务器。如果它在 .htaccess 中不起作用，请尝试站点范围内的 httpd.conf。其他需要检查的内容包括 CORS 和 206 部分内容/范围请求
• 检查您的脚本/HTML5:在您的 mp4 的空白页面中尝试使用准系统 HTML5 视频标签。如果有效，则页面中的脚本可能会影响视频播放。您还可以在播放全高清视频时检查 CPU 负载。

我通常使用videojs mp4 sample作为已知工作 mp4/服务器配置的引用。这适用于 mp4，但也适用于 webm/ogg(您可以使用 make web video 转码为 WebM 或 Ogg)。

让我们知道进展如何。