CODEWITHSUNDEEP
javascriptwebrtc
Jordan
Jordan

Reputation: 3996

convert local video file into media stream

I want to experiment file streaming using webRTC. It works perfectly with the camera/micro live (getUserMedia) but when I try to give it a pre-recorderd video file, I got this answer :

Uncaught TypeError: Failed to execute 'addStream' on 'RTCPeerConnection': parameter 1 is not of type 'MediaStream'.

Is there a simple way to use RTCPeerConnection with selected files like with .getUserMedia() ?

Edit:

Here is how I get the file but when I try to add the 'localStream' with the addStream method of RTCPeerConnection, it fail...

var localVideo = document.createElement("video");
var remoteVideo = document.createElement("video");

function onchange( event ){

    var file = this.files[0];
    var type = file.type;

    if( localVideo.canPlayType(type) ){

        var localStream = window.URL.createObjectURL(file);

        localVideo.src = localStream;

        ...

        peer.addStream(localStream); // fail here

    };

};

Upvotes: 4

Views: 10642

Answers (2)

Flimm
Flimm

Reputation: 150483

Create a video element with the video that you need:

<video controls src="http://example.com/example.webm">

When this video plays, you can retrieve the MediaStream object that you can reuse presumably for RTCPeerConnection:

const video = document.querySelector('video');
video.onplay = function() {
  const stream = video.captureStream();
  peer.addStream(stream);
};

This works in the same way for an audio element.

Upvotes: 1

jesup
jesup

Reputation: 6984

a) createObjectURL is evil. You can never know when the application is done with the resource until the navigate away. (and other issues) Use video.srcObject (video.mozSrcObject currently)

b) just because a video element can use a src URL for a streaming media file doesn't mean anything else can. AddStream takes MediaStreams, not URLs.

The Working Group is planning to add stream = video.captureStream(), but it isn't even speced yet

Update: the spec is here: Media Capture from DOM Elements It's implemented in Firefox, and Chrome 53 and above (see Sam Dutton's article)

Upvotes: 2

Related Questions