Question

我有一个Node.js进程，它将视频流输出到我的Node.js应用程序中。

在客户端，有一个<video>标记。我想将Node.js中的视频流式传输到视频标记的src属性中。我以前的经验告诉我，我们必须使用blob对象。但是，我并不百分之百确定如何以及为什么要使用它。

我想到的另一个可能的解决方案是在我的服务器上创建某种临时文件，然后将流写入该文件，然后将该文件作为视频源提供。但是，这似乎并不直观。我想知道，如果有一个更成熟的解决方案来处理这样的问题。

Answer 1

m3u8格式通常用于流式传输。视频流/转码是一种资源密集型的事情。如果你有这个选择，我建议你使用第三方服务。

Answer 2

您可能希望查看以下选项：

BinaryJS。它是基于websockets的双向实时二进制数据传输工具。
JSMpeg流服务器（在捕获的情况下）。您需要做的就是启动window["mapDataLayer"] = L.geoJson(geojson, { onEachFeature: function (feature, layer){ layer.on({ click: function showResultsInDiv() { var d = document.getElementById('tab4'); d.innerHTML = ""; for (prop in feature.properties){ d.innerHTML += prop+": "+feature.properties[prop]+"<br>"; } $('.nav-tabs a[href="#tab4"]').tab('show'); console.log(d.innerHTML); } }); } }).addTo(map);并将其指向运行nodejs脚本的域和端口。更多信息，您可以找到here。
直接管道流。好的答案张贴here。简而言之，您只需指定ffmpeg，Accept-Ranges，Content-Range和Content-Length标头，然后创建相关的Read流（带Content-Type和start选项）并将其传递给end对象。

Answer 3

两周前，我真的在黑客马拉松上试过这个。我最终几乎没有让这个flv流工作，我已在下面发布了。我的目的是建立一个库来自动化所需的大部分过程。

如您所见，我在服务器上打开了一个新端口来处理流向客户端的单独数据流。这反映在客户端的src标记中。

你需要的三件事：

这个Linux版本的ffmpeg。
Flowplayer在js方面。

npm fluent-ffmpeg

// StreamServer.js

var express = require('express'),
  app = express(),
  ffmpeg = require('fluent-ffmpeg');

module.exports = function () {
    app.stream(req, res)
    {
        res.contentType('flv');
        // make sure you set the correct path to your video file storage 
        var pathToMovie = '/path/to/storage/' + req.params.filename;
        var proc = ffmpeg(pathToMovie)
          // use the 'flashvideo' preset (located in /lib/presets/flashvideo.js) 
          .preset('flashvideo')
          // setup event handlers 
          .on('end', function () {
              console.log('file has been converted succesfully');
          })
          .on('error', function (err) {
              console.log('an error happened: ' + err.message);
          })
          // save to stream 
          .pipe(res, { end: true });

    };

}

// routes.js

'use strict';
var stream = require('../controllers/streaming.server.controller'),
 streamServer = require('../controllers/StreamServer.js'),
express = require('express');

// streaming.server.controller.js

module.exports = function (app) {
    app.get('/api/stream', function (req, res) {
        streamServer.stream(req, res);
    });
};

var path = require('path'),
 express = require('express'),
 app = express(),
 routes = require('../routes/routes.js')(app),
 ffmpeg = require('fluent-ffmpeg');

app.listen(4000);

编辑：客户端部分：

https://github.com/fluent-ffmpeg/node-fluent-ffmpeg/tree/master/examples/flowplayer

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="/flowplayer.min.js"></script>
        <title>node-fluent-ffmpeg</title>
    </head>
    <body>

        <!-- this A tag is where your Flowplayer will be placed. it can be anywhere -->
        <a  
             href="http://localhost:4000/api/stream"
             style="display:block;width:520px;height:330px"  
             id="player"> 
        </a> 

        <!-- this will install flowplayer inside previous A- tag. -->
        <script>
            flowplayer("player", "/flowplayer.swf");
        </script>
    </body>
</html>

（只需更改href属性）

如何将视频数据流式传输到视频元素？

3 个答案: