Never miss a webrtc-internals dump file

You know the feeling. A customer complains. Your app doesn't work for him. He can't connect the call. Or the call gets randomly disconnected. Or audio is only one way. There's echo. There's robotic audio. The video freezes. Quality is poor. Anything that can go wrong goes wrong.

What do you do?

Ask that user to open a chrome tab in parallel to your app, run the session and then download a webrtc-internals file from that tab and send it your way? I hope you're not seriously contemplating turning your users to QA engineers…

I've got a better idea for you - free of charge: use rtcstats.

Here's how the scheme goes

1. You integrate our open source rtcstats-js SDK in your client app
2. Instead of having it connect via Websocket to our rtcstats-server, have it store the data in the browser's IndexedDB for a couple of days - or until the next session - or the one after it.
3. Got a user complaining? Ask him to click some button somewhere in your app's settings to upload the data stored in IndexedDB to your server (I am assuming here that you associate that click with consent to read these stats). Or attach it to the support ticket right away.
4. Now that you have that file (lets call it an rtcstats dump) on your end, just upload it to rtcstats.com and debug the issue.

No upfront cost. No privacy issues.

It won't solve all your problems, but it is going to speed up the debugging of a lot of the tickets you're getting.

Here's where you need to make the code changes in rtcstats-js

1. Integrate the rtcstats-JS SDK

Install the rtcstats-js SDK and add it to your application:

npm i @rtcstats/rtcstats-js

Next, grab the trace-indexeddb.js file from this pull request (we have not yet decided how to integrate it yet) and add it to your application, along with its dependencies.

Then, instruct rtcstats to start collecting WebRTC data by calling:

const trace = new IndexedDBTrace();
wrapRTCPeerConnection(trace, window, {getStatsInterval: 1000});
wrapGetUserMedia(trace, window);
wrapEnumerateDevices(trace, window);
trace.connect(someSessionId);

where someSessionId is a session identifier you generate. This session identifier should let you uniquely identify the user's current session.

2. When the user complains

Get a blob which represents an RTCStatsDump using

trace.getSessionBlob(someSessionId);

Instead of downloading it to the user's download folder as the extension does it, you upload it to your server and attach it to your support ticket.

3. Manage the sessions in the long run

You can call await trace.listSessions() to get a list of stored session ids and trace.removeSession(someSessionId) to remove a session if you no longer need it.

-

Happy with what you're getting here?

Why not take the next step and use rtcstats-server to collect everything at all times? We're still in the realm of open source and free…

👉 Need help? Just contact us

👉 Want something tailored to your needs around WebRTC and its metrics? You already know where to find us