0

我正在运行 fluent-ffmpeg示例来流式传输视频，效果很好。现在在合同中显示基于 flashe 版本的 flowplayer 中的视频，我现在使用的是 html5 版本的 flowplayer，但它说找不到视频文件。 

app.get('/video2/abc', function(req, res) {

  console.log('/video/:filename');
  res.contentType('mp4');
  var pathToMovie = 'public/flowplayer/470x250.mp4' ; 
  var proc = new ffmpeg({ source: pathToMovie, nolog: true })
    .writeToStream(res, function(retcode, error){
      if(error) console.error('error',error); 
      else console.log('file has been converted succesfully');
    });
});

这是我的 html 模板。

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"> </script>
        <script src="http://releases.flowplayer.org/5.4.0/flowplayer.min.js"></script>
        <link rel="stylesheet" type="text/css" href="http://releases.flowplayer.org/5.4.0/skin/minimalist.css" />
        <title>node-fluent-ffmpeg</title>
    </head>
    <body>
   <script>
   // global configuration (optional)
   flowplayer.conf = {
      rtmp: "rtmp://s3b78u0kbtx79q.cloudfront.net/cfx/st",
      swf: "http://releases.flowplayer.org/5.4.0/flowplayer.swf"
   };

   // force flash with query - only for testing, do not use this switch in production!
   if (/flash/.test(location.search)) flowplayer.conf.engine = "flash";

   // install player manually
   $(function() {
      $(".player").flowplayer({
         // reverse fraction of video aspect ratio
         // video dimensions: 470px / 250px
         ratio: 25/47
      });
   });
</script>
    <div class="flowplayer">
        <video>
           <source type="video/mp4" src="/video2/your_movie"/>
        </video>
    </div>
    </body>
</html>
4

1 回答 1

1

我遇到了类似的问题，并决定改用 video-js。开箱即用，效果很好。

看看： http: //www.videojs.com/

就我而言，我用 jquery 注入视频标签并动态加载视频。像这样：

    //I append the video tag so I remove it if I already appended it before.
    if($('#player').length) $('#player').remove();


    $('body').append('<video id="player" class="video-js vjs-default-skin" controls preload="auto" width="100%" height="100%" poster="my_video_poster.png" data-setup="{}"> <source src="'+url+'" type="video/webm"></video>');

    // Load the player dynamically. see: http://www.videojs.com/docs/setup/
    _V_("player", {}, function(){});
于 2013-05-23T12:30:36.780 回答