HTML5视频|视频不支持/无效的文件类型| IE

晚安StackOverflowers!
我似乎有一个问题,让HTML5视频标签在IE或Safari中运行(Firefox似乎加载,但它想在播放之前下载整个文件).它可以在Chrome中正常运行.

在IE中,我收到错误:“错误:不支持的视频类型或无效的文件路径”.

我做过研究,似乎很多人通过在他们的.htaccess文件中添加MIME类型来找到解决方案.我这样做无济于事.接下来的问题是我需要将.mp4放在视频列表的第一位,完成 – 但没有解决方案.

我的.htaccess文件如下所示:(WordPress Install)

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /wpress/
RewriteRule ^index\.php$- [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /wpress/index.php [L]
</IfModule>

# END WordPress

#Audio HTML5 Mime Types
AddType audio/aac .aac
AddType audio/mp4 .mp4 .m4a
AddType audio/mpeg .mp1 .mp2 .mp3 .mpg .mpeg
AddType audio/ogg .oga .ogg
AddType audio/wav .wav
AddType audio/webm .webm

#Video HTML5 Mime Types
AddType video/mp4 .mp4 .m4v
AddType video/ogg .ogv
AddType video/webm .webm

另外,这就是我的视频代码:(是的,我知道它是罗嗦的…)

<video width="100%" height="100%" controls="controls">
  <source src="http://www.frozentears.org/wpress/wp-vlog/vlogVid/Rus/[RUS]Rossiyskaya.Imperia/[RUS]Rossiyskaya.Imperia.E01.Petr.I.PI.mp4" type='video/mp4' />
  <source src="http://www.frozentears.org/wpress/wp-vlog/vlogVid/Rus/[RUS]Rossiyskaya.Imperia/[RUS]Rossiyskaya.Imperia.E01.Petr.I.PI.webm" type='video/webm' />
  Video tag not supported. Download the video <a href="http://www.frozentears.org/wpress/wp-vlog/vlogVid/Rus/[RUS]Rossiyskaya.Imperia/[RUS]Rossiyskaya.Imperia.E01.Petr.I.PI.mp4">here</a>.
</video>

在这里可以看到给我提出问题的整个页面:http://bit.ly/1g2quqe
我检查了堆栈,发现这些线程here,herehere,遵循他们的建议,但由于某种原因它仍然没有为我工作.

此外,有些人建议我将文件路径放在地址栏中,如果文件播放则错误在代码中.当我把.mp4文件放在地址栏中时,我只是提示下载文件,浏览器没有播放该文件.

任何建议将不胜感激.
最好的祝福,
劳拉

解决方法

我无法在任何浏览器上正确播放您的文件. Chrome仅在下载30秒后才播放音频,但没有视频.在Firefox中,当我尝试将mp4的URL放入浏览器时,我收到一条错误消息,说文件已损坏.我认为这可能是文件格式问题.如果是这种情况,它可能是文件中的一些错误数据或元数据:

>您可以在http://vjs.zencdn.net/v/oceans.mp4下载该文件并将其托管在您的服务器上.如果它工作正常,那么你的MIME / TYPES配置就好了,否则你需要正确调整它们(看看将它们添加到/etc/mime.types文件中).
>您可以尝试使用handbrakeMP4Box重新包装文件.您需要使用手刹激活“web optimized”选项(也称为快速启动).

你可以在这里阅读基础story.

如果有效,请告诉我们

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码
HTML5使用DOM进行自定义控制
使用HTML5 Canvas绘制阴影效果的方法
使用PHP和HTML5 FormData实现无刷新文件上传
如何解决HTML5 虚拟键盘出现挡住输入框的问题
HTML5中div和section以及article的区别分析
html5和CSS 实现禁止IOS长按复制粘贴功能
html5 touch事件实现触屏页面上下滑动
canvas 模拟实现电子彩票刮刮乐的代码
HTML5 Plus 实现手机APP拍照或相册选择图片上传的功能
Android自定义环形LoadingView效果
HTML5 canvas绘制五角星的方法
html5使用html2canvas实现浏览器截图
使用Canvas处理图片的方法介绍
利用Canvas模仿百度贴吧客户端loading小球的方法