【发布时间】：2014-01-27 01:35:16
【问题描述】：
一些背景
我已经在 FF 和 Safari（包括 iDevices）中测试了我的视频，它可以正常播放，但无法在 Chrome 浏览器中播放。正如您在下面的代码中看到的，我已经创建了 mp4、m4v、webM 和 ogv 文件，并且我已经在我的计算机上测试了所有这些文件是否存在播放问题。
症状/问题
在 Chrome 中，视频似乎已加载，并且控制台日志中没有错误。当按下播放按钮时，它会加载文件的一部分，但随后不会播放。然而，有趣的是，如果我在时间栏中任意单击稍后的时间，比如大约中途，即使有字幕，它也会播放大约 5 秒的视频，但 没有音频。 p>
我的研究
我已经阅读了可能导致此问题的任何问题，但我没有找到任何可行的想法。需要注意的是，我在 .htaccess 文件中编写了以下内容：
# ----------------------------------------------------------------------
# Proper MIME type for all files
# ----------------------------------------------------------------------
# Audio
AddType audio/ogg oga ogg
AddType audio/mp4 m4a
AddType audio/webm webm
# Video
AddType video/ogg ogv
AddType video/mp4 mp4 m4v
AddType video/webm webm
# Assorted types
AddType image/x-icon ico
AddType image/webp webp
AddType text/cache-manifest appcache manifest
AddType text/x-component htc
AddType application/x-chrome-extension crx
AddType application/x-opera-extension oex
AddType application/x-xpinstall xpi
AddType application/octet-stream safariextz
AddType application/x-web-app-manifest+json webapp
AddType text/x-vcard vcf
AddType text/plain srt
另外，我正在使用 mediaelement.js 库。
代码
这是 HTML：
<video width="100%" height="400" poster="assets/img/myVideo.jpg" controls="controls" preload="none">
<!-- M4V for Apple -->
<source type="video/mp4" src="assets/vid/PhysicsEtoys.m4v" />
<!-- MP4 for Safari, IE9, iPhone, iPad, Android, and Windows Phone 7 -->
<source type="video/mp4" src="assets/vid/PhysicsEtoys.mp4" />
<!-- WebM/VP8 for Firefox4, Opera, and Chrome -->
<source type="video/webm" src="assets/vid/PhysicsEtoys.webm" />
<!-- Ogg/Vorbis for older Firefox and Opera versions -->
<source type="video/ogg" src="assets/vid/PhysicsEtoys.ogv" />
<!-- Subtitles -->
<track kind="subtitles" src="assets/vid/subtitles.srt" srclang="en" />
<track kind="subtitles" src="assets/vid/subtitles.vtt" srclang="en" />
<!-- Flash fallback for non-HTML5 browsers without JavaScript -->
<object width="100%" height="400" type="application/x-shockwave-flash" data="flashmediaelement.swf">
<param name="movie" value="flashmediaelement.swf" />
<param name="flashvars" value="controls=true&file=assets/vid/PhysicsEtoys.mp4" />
<!-- Image as a last resort -->
<img src="assets/img/myVideo.jpg" width="320" height="240" title="No video playback capabilities" />
</object>
</video>
下面是简单的js：
$('video,audio').mediaelementplayer({
features: ['playpause','progress','current','tracks','volume'],
startLanguage: 'en'
});
有什么想法吗？
感谢您在这件事上的任何帮助！
【问题讨论】：
-
Firefox 现在支持 MP4/H264 btw mozilla.org/en-US/firefox/26.0/releasenotes
-
什么是.m4v？为什么不能为所有设备使用 MP4？
-
@hendry：不过，它看起来好像只在 Linux 平台上受支持，我需要让它尽可能广泛地访问。关于 .m4v 文件。它适用于 Apple 设备。在一些帮助下，我认为我已将其范围缩小到编解码器问题以及视频元素中可能对源类型进行排序。我今天会修修补补，如果我找到解决方案，请发布。
标签： html google-chrome html5-video mediaelement.js