Fatal编程技术网
  • html/
  • 如何以html格式缓冲托管在不同服务器上的视频 我有一个.mp4文件的视频url 当我尝试使用html5视频标签或video.js播放时，视频从不缓冲 但当我在浏览器中尝试相同的链接时，它会下载视频

如何以html格式缓冲托管在不同服务器上的视频 我有一个.mp4文件的视频url 当我尝试使用html5视频标签或video.js播放时，视频从不缓冲 但当我在浏览器中尝试相同的链接时，它会下载视频

html flash

如何以html格式缓冲托管在不同服务器上的视频 我有一个.mp4文件的视频url 当我尝试使用html5视频标签或video.js播放时，视频从不缓冲 但当我在浏览器中尝试相同的链接时，它会下载视频,html,flash,html5-video,flash-video,Html,Flash,Html5 Video,Flash Video,代码： <html> <head> <link href="http://vjs.zencdn.net/4.5/video-js.css" rel="stylesheet"> <script src="http://vjs.zencdn.net/4.5/video.js"></script> </head> <body> <video

代码：

<html>
    <head>
        <link href="http://vjs.zencdn.net/4.5/video-js.css" rel="stylesheet">
        <script src="http://vjs.zencdn.net/4.5/video.js"></script>
    </head>
    <body>
        <video width="320" height="240" controls>
        <source src="http://vl.mccont.com/ItemFiles/%5BFrom%20www.metacafe.com%5D%2011334027.29120961.4.mp4?__gda__=1397298243_b382c45af7c5325b3f7443f57412d04c 
" type="video/mp4">
            Your browser does not support the video tag.
        </video>
        <video id="my_video_1" class="video-js vjs-default-skin" controls
 preload="auto" width="640" height="264" poster="my_video_poster.png"
 data-setup="{}">
 <source src="http://vl.mccont.com/ItemFiles/%5BFrom%20www.metacafe.com%5D%2011334027.29120961.4.mp4?__gda__=1397298243_b382c45af7c5325b3f7443f57412d04c" type='video/mp4'>

</video>
    </body>
</html>


您的浏览器不支持视频标记。
我无法用谷歌搜索出这个问题。请帮忙

编辑

上述代码在firefox中运行良好，视频可以播放。它不适用于chrome，似乎是插件问题之类的…

我的代码也有您在我这边描述的问题。除了Chrome之外，它在任何地方都能工作。我发现，如果我把你的mp4放在我的一台服务器上，它就可以正常工作。。。即使是铬合金

基于这一点，我怀疑服务器端的问题，即您的mp4交付服务器没有针对HTML5视频进行适当调整。 此问题的常见来源是MIME类型。我建议你仔细检查一下这个区域

“MIME类型背后的丑陋头”一节可以告诉你如何做到这一点（谷歌上的其他相关文章也针对不同风格的服务器讨论了这个问题）

让我们知道它是否适合您。

我修改了视频代码，如下所示：

<video id="movie" width="320" height="240" preload controls>

  <source src="http://c6969c880f66ae12a3e2-87bf587b08b2b7b4541aa273825a564d.r1.cf1.rackcdn.com/11334027.29120961.4.mp4" />
  <object width="320" height="240" type="application/x-shockwave-flash"
    data="flowplayer-3.2.1.swf">
    <param name="movie" value="flowplayer-3.2.1.swf" />
    <param name="allowfullscreen" value="true" />
    <param name="flashvars" value="config={'clip': {'url': 'http://c6969c880f66ae12a3e2-87bf587b08b2b7b4541aa273825a564d.r1.cf1.rackcdn.com/11334027.29120961.4.mp4', 'autoPlay':false, 'autoBuffering':true}}" />

  </object>
</video>
现在它适用于所有浏览器。虽然使用
video.js
的意图没有实现。

我无法理解确切的问题，但代码中的一点细微变化起到了作用。我刚刚发布了解决方案。您确实为更好地支持HTML5视频传输的服务器提供商更改了源标记的src（在您的案例中是rackcdn），因此您的问题得到了解决。虽然我可以让你的新URL在Chrome浏览器中与videojs一起工作，但它太滞后了。@Florestan06对不起，我忘了我已经更改了视频URL&因此，这不是正确的答案。寻找一个插件或其他东西，可以在chrome中修复它。我们可以考虑检测用户代理并强制chrome的flash回退，但这并不理想。例如，Android上的Chrome将无法使用flash，然后需要检测Android…我过去曾成功地将HTML5视频交付给Chrome，但这需要有一个适当的mp4文件和一个具有适当mime类型的服务器。如果您无法控制服务器，并且无法将文件托管在其他地方，那么您将陷入半满意的解决方案。例如，试试你的视频的这个URL，它在你的任何一个例子中都可以正常工作。你的mp4视频文件可能也有问题，因为当同一页面上同时有视频标签和videojs时，Chrome很难播放它。videojs中的参考mp4文件在任何地方都可以很好地使用多个实例。