Search code examples
javascriptwebrtchtml5-video

How to save the stream frames at the client in Webrtc?

I'm using the video conference implementation source code using webrtc and nodejs.

I'm sending a video from a server to a client. I need to compute the PSNR of the received video to compute the objective visual quality.

My concerns are:

  1. how to save the streamed frames at the client, from the video component of HTML5?
  2. If (1) is achieved, how to map the original frames with the received ones?
Solution

  • Record Audio and Video with MediaRecorder

    I solved the problem using MediaRecorder. Using MediaRecorder API, you can start and stop the recorder, and collect the stream data as they arrive.

    The MediaStream can be from:

    • A getUserMedia() call.
    • The receiving end of a WebRTC call.
    • A screen recording.

    It support the following MIME types:

    • audio/webm
    • video/webm
    • video/webm;codecs=vp8
    • video/webm;codecs=vp9

    The following demo demonstrates that and the code is available as well

    I still have to solve the second concern!! Any idea for mapping the local and remote video frames?