CODEWITHSUNDEEP
javascripthtmlnode.jsvideovideo-streaming
SergioBR
SergioBR

Reputation: 91

Video source from javascript blob

I'd like to display a video from a stream;

I have a nodeJS server sending an ogg video stream to a websocket port, and when a client connects to that port, it starts receiving the video stream data, but the following method does not seem to understand the data as video correctly...

In the following context, "camera" is a html5 video tag id:

function connectWS()
{
  var client = new BinaryClient('ws://192.168.161.193:8088');
  client.on('stream', function(stream, meta)
  {
    stream.on('data', function(data)
    {
      var arrayBuffer = [];
      arrayBuffer.push(data);
      var video = new Blob([new Uint8Array(arrayBuffer)], { type: "video/ogg" });
      document.getElementById('camera').src = (window.URL || window.webkitURL).createObjectURL(video);
    });
  });
}

Someone seems to already have the video blob working, but I can't find how...

Display a video from a Blob Javascript

Thank you!

Upvotes: 5

Views: 9918

Answers (1)

Star Brilliant
Star Brilliant

Reputation: 3136

stream.ondata is fired every time a new chunk of data is received.

You tried to create a new blob multiple times in stream.ondata.

I think you may wanted to create a new blob only once in client.onstream and push data into it multiple times.

Upvotes: 4

Related Questions