how to do webRTC in reactJs

Question

Am trying to include a webRTC tech to my already existing reactJs App

the problem is that react is not recognizing the webRTC API's

  Line 185:19:  'webkitRTCPeerConnection' is not defined  no-undef
  Line 191:1:   'rtcPeerConn' is not defined              no-undef
  Line 212:3:   'rtcPeerConn' is not defined              no-undef
  Line 214:62:  'rtcPeerConn' is not defined              no-undef

this function is inside a functional react component

 function startSignaling(){
  displayMessage("start signaling...");
rtcPeerConn = new webkitRTCPeerConnection(configuration)  
//send ice candidate to other peer
      rtcPeerConn.onicecandidate  = function(evt){
          if(evt.candidate){
              io.emit("signal",{"type":"ice candidate","message":JSON.stringify({'candidate':evt.candidate}),room:signal_room})
              displayMessage("completed that ice candidate");
          }
      }
rtcPeerConn.onnegotiationneeded = function(){
  displayMessage("on negotiationnneded");
  rtcPeerConn.createOffer(sendLocalDesc,logerror);

}
rtcPeerConn.onaddstream = (evt,err)=>{
  displayMessage("creating  the other stream");
  if(err){
      displayMessage(err)
  }
  success2(evt.stream);
}

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

      navigator.mediaDevices.getUserMedia({video:true,audio:true}).then(stream=>{
          success(stream);
        //  rtcPeerConn.addStream(stream);
      }).catch(err=>{
          logerror(err);
          });

}

Answer 1

The problem is not with React not recognizing the WebRTC APIs, you didn't define the rtcPeerConn variable. Also, webkitRTCPeerConnection (vendor prefixes) are not required for this API, use RTCPeerConnection instead.

Replace the rtcPeerConn = new webkitRTCPeerConnection(configuration) line with:

let rtcPeerConn = new RTCPeerConnection(configuration);