通过nodejs流式传输图像

时间:2014-10-21 07:52:42

标签: node.js mjpeg

我一直致力于解决方案,将一系列jpg流式传输到客户端,并将它们显示为视频。这是为了避免全景演示中的iPad上的自动播放问题。我们不需要音频,因此我尝试查看MJPEG,但由于浏览器从不缓存流,因此它不是一个可行的解决方案,尽管它在客户端上表现非常好。

有没有人遇到类似的东西,你解决了吗?在这一点上,我有点痴迷于让它发挥作用!

到目前为止,node.js MJPEG流媒体服务器看起来像这样:

var express = require('express'),
    fs = require('fs'),
    http = require('http');

var app = express();

var server = http.createServer(app);

// Routes
app.use(express.static('app'));

app.get(/\.(mjpeg)$/i, function(request, res) {
    var path = res.req._parsedOriginalUrl.path,
        string = path.replace(/.*\\|\..*$/g, ''),
        name = string.replace('/', '');

    var files = fs.readdirSync('app/assets/streams/' + name + '/');

    res.writeHead(200, {
        'Content-Type': 'multipart/x-mixed-replace; boundary=myboundary',
        'Cache-Control': 'no-cache',
        'Connection': 'close',
        'Pragma': 'no-cache'
    });

    var i = 1, id;
    var stop = false;

    res.connection.on('close', function() { stop = true; });

    var send_next = function () {
        if (stop)
            return;

        i = (i + 1);

        // Increment with zero based number padding. (SO: ignore this, implementation specific)
        if (i < 100 && i >= 10)
            id = '0' + i;
        else if (i < 10)
            id = '00' + i;
        else
            id = i;

        var filename = id + '.jpg';

        //console.log(i, id, 'file length:', files.length, 'Path: app/assets/streams/' + name + '/' + filename);

        fs.readFile('app/assets/streams/' + name + '/' + filename, function (err, content) {
            res.write("--myboundary\r\n");
            res.write("Content-Type: image/jpeg\r\n");
            res.write("Content-Length: " + content.length + "\r\n");
            res.write("\r\n");
            res.write(content, 'binary');
            res.write("\r\n");

            // Start next in stream
            setTimeout(send_next, 42);
        });

        // If we're at the end, reset current stream.
        if (i === files.length) i = 1;
    };

    send_next();
});

// Setup
var port = process.env.PORT || 5000;

server.listen(port, function() {
    console.log('Listening on ' + port);
});

我知道在该代码中可以进行一些优化,但它仅用于演示目的。

编辑:我正在寻找可以提供400帧(~20kb,可能是base64编码的字符串)的解决方案,然后我可以在客户端上缓存,并在连续循环中流式传输。好奇,如果其他人已经解决了类似的问题,以及如何。

0 个答案:

没有答案