0

我在我的网站上播放了一个视频，它适用于我测试过的所有浏览器，除了谷歌浏览器。

视频播放，但真的很生涩。

我该如何解决这个问题，它有时会卡住，然后播放，然后卡住等等。

这是我的代码

<video autoplay="autoplay" loop="loop" preload="auto" muted="muted" poster="images/backscreen.jpg" width="640" height="360">
    <source src="videos/footage_test.mp4" type="video/mp4" />
    <object type="application/x-shockwave-flash" data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" width="640" height="360">
        <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
        <param name="allowFullScreen" value="true" />
        <param name="wmode" value="transparent" />
        <img alt="Backscreen" src="images/backscreen.jpg" width="640" height="360" title="No video playback capabilities, please download the video below" />
    </object>
</video>
4

2 回答 2

1

对此你真的无能为力。您的描述没有足够的具体信息来确定确切原因，但很可能是其中之一：

  1. 您没有足够的带宽来支持流式视频（在客户端或服务器端）
  2. Chrome 与其他浏览器中用于播放的编解码器不同。您使用的是 Flowplayer，因此可能在 Chrome 中使用 HTML 5，而在其他浏览器中使用 Flash，从而产生各种实现差异，包括编解码器的选择。（例如，可以使用硬件编解码器。）
于 2013-08-01T17:11:58.517 回答
0

我遇到了同样的问题，发现可以通过为视频源 URL 设置 Cache-Control、ETag 和 Expires 响应标头来解决。

如果您还没有这样做，您可能还想设置 Content-Range、Accept-Ranges、Content-Length 和 Content-Type。

这就是您可以使用 nodejs 实现此目的的方式

fs.stat(path, function(err, stat) {
  if (err) Error(err);
  var positions = req.headers.range.replace(/bytes=/, "").split("-");
  var start = parseInt(positions[0], 10);
  var total = stat.size;
  var end = positions[1] ? parseInt(positions[1], 10) : total - 1;
  var chunksize = (end - start) + 1;
  res.writeHead(206, {
    'Content-Range': 'bytes ' + start + '-' + end + '/' + total,
    'Accept-Ranges': 'bytes',
    'Content-Length': chunksize,
    'Content-Type': 'video/mp4',
    'Cache-Control': 'public, max-age=2592000',
    'ETag': stat.md5Hash,
    'Expires': new Date(Date.now() + 2592000000).toUTCString(),
  });
  // Send file stream
  sendStream(path, start, end);
});
于 2016-05-10T13:53:09.127 回答