January 9, 2019 10:00 am

WebRTC UWP & callstats.io integration sample released!

Early last year, we announced support for Real-Time Communications on the Universal Windows Platform based on a fork of Google’s WebRTC.org repo. The project enables native UWP developers to build Chrome compatible and feature equivalent RTC apps for all Windows 10 platforms, including Desktop, HoloLens, Xbox and ARM powered laptops. Since that time we’ve seen tremendous community interest in the project including 26K NuGet downloads and hundreds of developers reaching out on GitHub and email. We’ve also made numerous improvements to both WebRTC and ORTC UWP and announced our contribution of UWP support back to the Google WebRTC.org repo – more details will be shared in the coming months.

One thing we’ve heard consistently from developers is that they want better insight into the quality of WebRTC calls on their applications. This could be a call from HoloLens to a Desktop browser or a real-time video streaming application for Xbox. To that end, we have partnered with callstats.io to provide platform portable .NET integration for their WebRTC monitoring and analytics service!

Today we are announcing the release of a .NET Standard 2.0 NuGet package for callstats.io, along with a code sample based on the PeerCC UWP source. As a .NET Standard library it is available to all supported .NET implementations including the .NET Framework, .NET Core, UWP, Xamarin and Unity platforms (check the documentation for version requirements). The PeerConnection sample demonstrates a UWP application that establishes a 2-way video call and sends the WebRTC stats to the callstats.io service in 10 second intervals.

Here is an example dashboard showing statistics for the entire service:

callstats.io dashboard showing statistics

Kognitiv Spark, a leader in mixed reality systems and a Windows 10 developer, is using the callstats.io service with its RemoteSpark application.

“Our operations team had faced challenges helping customers resolve network problems that can disrupt a mixed reality session,” said Ryan Groom, cofounder and CTO, Kognitiv Spark. “With native support in Windows 10, we were able to turn-up the callstats.io service in a few hours and begin using the rich data available in its dashboard to detect and expedite problem resolution.”

Let’s take a look at the steps for integration.

1) Create a callstats.io account.

  • Go to https://dashboard.callstats.io/register and create the Organization
  • Navigate to the apps tab to create an app and enter the SDK as other “UWP”
  • From the left side panel, click on “App Settings” and navigate to the “Security” tab
  • Click on “New credentials” and choose a label for the key
  • Select the key type as “ECDSA” and enter the public key
  • Under the key details, click on “view” for the credential

2) To authenticate with callstats.,io it is necessary to generate cryptographic keys and upload the public key to the service. Follow the instructions in the readme.md file here. After completing this step, you should have a Config class and .p12 certificate in your project. That’s all you need to authenticate to the callstats.io REST API.

3) Reference the Org.WebRtc.Callstats NuGet package available here in your project.

4) If you are using PeerCC sample you can find classes for collecting data from PeerCC and WebRTC in the Stats folder, you can also use this code as an example for your implementation. Add the files in the  folder of PeerCC-Sample repo to your project:

  • PeerConnectionControllerStateChange.cs: Tracks RTCPeerConnection state changes and collects data from peer connection states for submission to callstats.
  • StatsController.cs: Collects data from the entire PeerCC sample and uses the Org.WebRtc.Callstats library to send prepared data to the callstats.io REST API.
  • WebRtcStats.cs: Prepares statistics obtained from RTCPeerConnection for communication to callstats.io via the REST API.

5) Initialize the callstats.io service and send SDP and application errors via the StatsController. For an example, see Conductor.cs in PeerCC-Sample.

6) Handle ICE state changes on RTCPeerConnection and use PeerConnectionStateChange to send data to the service:


_peerConnection.OnIceGatheringStateChange += async() => 

            { 

                await PeerConnectionStateChange.StatsOnIceGatheringStateChange(_peerConnection); 

                Debug.WriteLine("Conductor: Ice connection state change, gathering-state=" + _peerConnection.IceGatheringState.ToString().ToLower()); 

            }; 

            _peerConnection.OnIceConnectionStateChange += async () => 

            { 

                if (_peerConnection != null) 

                    await PeerConnectionStateChange.StatsOnIceConnectionStateChange(_peerConnection); 

                else 

                { 
                    await PeerConnectionStateChange.PeerConnectionClosedStateChange(); 

                    ClosePeerConnection(); 

                } 

};

7) Send application level events for audio muting and unmuting to StatsController. For an example, see MainViewModel.cs in PeerCC-Sample.

The sample should now be fully wired up to the callstats.io service and ready for testing. This is only the beginning of the possibilities for improving call quality, future work will focus on improving user experience with additional metrics and AI. We are excited to hear feedback from the community on uses for the library. Let us know what you think on GitHub or in email!

Join the conversation