Video streaming

[mnurme]

Hello,

I have vapix running on my system. Any suggestions how can I get my client side to display video stream on webpage? Is there any chance that h.264 format will be supported in the future?

Regards

[gluxon]

Yup. I had to do this for my robotics team a while back. node-mjpeg-server should be able to help out.

https://github.com/gluxon/node-mjpeg-server/

I no longer actively work on either repositories, but pull requests are always appreciated!

[mnurme]

Will look into mjpeg-server. I will be using my axis camera in my robot as well for live video.

With VAPIX I was hoping to send video data from server to client like this:

video.on('data', function(data, error) {
    if (error) {
        console.log('Error with video stream: ');
        throw error;
    }
    else {
        io.sockets.emit('VideoStream', data); //Send video data to client via websockets
    }
});

Can it be done this way? I don't know how to read that data it in a video tag.. how do I pass the data stream to html?

Anyway, good work with node-VAPIX! Hope You will keep adding new features. Will add pull request. ;)

Thank You!

[gluxon]

The mjpeg stream should be able to be inserted into a web page through the standard image tag. I just tested this out and it works in Firefox and Chrome.

<img src="http://localhost:8081/" />

Checkout the example in the node-mjpeg-stream repository if you haven't already.

[mnurme]

Thanks a lot! Finally got it working. :) Although I get lots of lag compared to camera video feed by logging straight to cameras IP address. Both using same compression rate (30), the stream straight from the camera is smooth and fast, but stream through my node server to client has up to 10 seconds of lag. Do You have any idea where I might go wrong doing this?

I have tried many ways. Got things working in the following way:

server side:

video.on('data', function(data, error) { if (error) { console.log('Error with video stream: '); throw error; } else { var frame = new Buffer(data).toString('base64'); io.sockets.emit('VideoStream', frame); } });

client side:

<img id="videoview" width = "800" height = "600"></img>

<script>

    var socket = io.connect("http://localhost:8080/");

    socket.on('VideoStream', function(data) {

        $("#videoview").attr("src", "data:image/jpeg;base64," + data.toString("base64") );

    });

I could not get it to work by doing:

<img src="http://localhost:8081/" />`

Forgive me if all this seems really basic, but I have very little knoweldge of streaming video. I cant really understand what is the purpose of mjpeg-server? Why is it necessary to write data coming from the camera to file and then feed that file to client (on html side)? Why not send data stream coming from the camera straight to client via socket.io? Im also unable to find node-mjpeg-stream repository. I would be really thankful if you could point me to the right way of doing this (for streaming as little lag as possible).

[gluxon]

Glad you got it working!

Sorry for the late reply, but I vaguely remember having performance issues as well when I was using this library a year or two ago. Perhaps the code needs to be updated for the latest version of Node.js, or something else.

The mjpeg-server isn't necessary if you've figured it out otherwise, but I would imagine sending an entire video stream through socket.io events may have something to do with the performance.

I don't know if I'll have time to narrow down where the performance issues are coming from. If you figure it out, a pull request would be definitely appreciated.