Remote preview and control for a video recording application using WebRTC

This post shows how to implement a remotely controlled video recording application with MWriter and WebRTC technology. For the initial WebRTC description and signaling see the post on remote preview for playlists and getting started with WebRTC.


There are two steps to it: building a writer application with MPlatform SDK or MFormats SDK and making a web page to control it.


Writer application 


- MPlatform SDK:


  • Create and initialize the MWriter object as usual.
  • Create a MWebRTC class instance. It will transmit stream preview to the web page and receive messages from it. 
  • Logit to signaling server and join room (receivers will join the same room).
  • Subscribe for the events of MWebRTC (we will need it to receive messages).
  • Add it as a plugin to the MWriter object.
  • Done! Once MWriter is started, the frames will be transmitted by the MWebRTC class object automatically. 


//WebRTC class is used to send audio video to remote peer 
MPLATFORMLib.MWebRTCClass m_objWebRTC = new MWebRTCClass();

//Login to signaling server. We will use default Medialooks one and room named "room555"
m_objWebRTC.Login("https://Medialooks.com:8889/room555", "MyName", out myId);

//We need to handle WebRTC object events to be able to get messages 
m_objWebRTC.OnEvent += new IMEventsEvent_OnEventSafeEventHandler(m_objWebRTC_OnEvent); 

//Add WebRTC plugin to start network streaming 
//Web clients can connect\disconnect at any time 
m_objWriter.PluginsAdd(m_objWebRTC, 0);

//Handle remote messages, parse them and use to control your Writer object 
void m_objWRTC_OnEvent(string bsChannelID, string bsEventName, string bsEventParam, object pEventObject) 
{ 
    if (bsEventName == "message") 
    { 
        //Parse message and control your object 
    } 
}


- MFormats SDK: 


  • Create MWebRTC class instance. It will transmit stream preview to the web page and receive messages from it.  
  •   Logit to signaling server and join room (receivers will join the same room). 
  • Subscribe for the events of MWebRTC object (we will need it to receive messages). 
  • Start feeding frames to MWebRTC object. The frames will be transmitted automatically. 


//WebRTC class is used to send audio video to remote peer  
MPLATFORMLib.MWebRTCClass m_objWebRTC = new MWebRTCClass();  

//Login to signaling server. We will use default Medialooks one and room named "room555"
m_objWebRTC.Login("https://Medialooks.com:8889/room555", "MyName", out myId);

//We need to handle WebRTC object events to be able to get messages  
m_objWebRTC.OnEvent += new IMEvents_OnEventEventHandler(m_objWebRTC_OnEvent);

//Handle remote messages, parse them and use to control your application 
void m_objWRTC_OnEvent(string bsChannelID, string bsEventName, string bsEventParam, object pEventObject)  
{  
    if (bsEventName == "message")  
    {  
        //Parse bsEventParam message and control your object  
    }  
}

//Feed frames to WebRTC object. Transmitted frames will be received by all viewers 
m_objWRTC.ReceiverFramePut(pFrame, 0, "");


Web page


Check out the following articles to find our how to receive and display WebRTC stream on a web page: 



Try this feature with our sample application 


To evaluate this feature check the Remote Writing Control Sample application here: "...\Medialooks\MPlatform SDK\Samples WebRTC\C#\Sample Remote Writing Controll\bin\x86\Debug".


And it's web page here: "...\MPlatform SDK\Samples WebRTC\HTML\MplWritingControl.html".




  Please note that there are 3 types of URL available for tests: 

  • Local file URL - just a HTML file in MPlatfrom installation folder. You can use it to try the preview locally. 
  • Local server URL - it's a default URL of the page deployed to your locel web server. You can use it locally or shere the preview with someone else if they have access to your local web server.
  • Medialooks server URL - it's a HTML page deployed to our server. You can use it to control your application over the internet or even share with someone else. Send this link to your freinds and let them preview or control your playout application! 

See also