Recording the web page by using Record RTC with Angular

Question

I want do recording the particular part in the page as video with audio . For example when user enter the page will automatic recording what happening occurs (like iframe video )the particular part in the page and the user close the page or click the stop button will stop recording and save video to the file. Now I using Record RTC to do it and try to use canvas method still cannot. Anyone can give me suggestion and solution to do this feature . Thanks for Helping. You can edit in this page. https://stackblitz.com/edit/angular-record-rtc-demo-si2c8x

Crescendo

Answer 1

I suggest using the APIs provided by Kurento to record web pages :

1. Configure Secure WebSocket in KMS. For instructions, check Signaling Plane security (WebSocket).
2. In index.js, change the ws_uri to use Secure WebSocket (wss:// instead of ws://) and the correct KMS port (TCP 8433 instead of TCP 8888).
3. As explained in the link from step 1, if you configured KMS to use Secure WebSocket with a self-signed certificate you now have to browse to https://{KMS_HOST}:8433/kurento and click to accept the untrusted certificate.

Example with javascript implementation :

var startRecordButton = document.getElementById("start");

startRecordButton.addEventListener("click", startRecording);

function startRecording() {
   var options = {
     localVideo: videoInput,
     remoteVideo: videoOutput
   };

   webRtcPeer = kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options, function(error) {
      if(error) return onError(error)
      this.generateOffer(onOffer)
   });

   [...]
}

This is a link to the documentation : Kurento Recorder

Frustrated