Is it possible to access the chrome://webrtc-internals/ variables through an API in JavaScript?

Question

Is it possible to access the chrome://webrtc-internals/ variables through an API in JavaScript?

I couldn't find any information about how to access the logged variables in chrome://webrtc-internals/ on google. There is not even a description of the graphs available there.
I am specifically interested in packetsLost, googCurrentDelayMs, and googNacksSent.

The reason behind wanting access to webrtc-internals
I am currently developing a video streaming application on Google Chrome that works peer-to-peer. This application uses peerjs to share the stream with other peers, utilizing Google's WebRTC technology as its foundation. To enhance the performance of my application, it would be crucial for me to monitor significant delays. As I can track these delays through logs in chrome://webrtc-internals/, I was interested in finding out if I could retrieve this data using JavaScript.

My assumption is that there isn't an API available for the chrome://webrtc-internals/ menu.

javascript google-chrome webrtc google-chrome-app peerjs

Answer 1

Answer №1

I managed to solve this issue by delving into various Google community threads (thread 1, thread2):

var peerjs = new Peer(...); // initializing PeerJS
var connections = peerjs.connections;

The 'connections' variable is an object:

Object {2e1c5694-e6ef-e1b2-22d5-84a3807961d4: Array[3]}
    2e1c5694-e6ef-e1b2-22d5-84a3807961d4: Array[3]
        0: DataConnection
        1: MediaConnection
        2: MediaConnection
        length: 3
    __proto__: Array[0]
__proto__: Object

You can inspect any of these connection objects:

var rtcPeerConn = connectionObject.pc; // RTCPeerConnection

rtcPeerConn.getStats(function callback(connStats){
    var rtcStatsReports = connStats.result(); // an array of available status reports
    // Each status report object contains multiple variables, like googCurrentDelayMs.
    // You'll need to iterate through the objects and check their names to find the desired report.
    rtcStatsReports[7].names(); // returns all available variables for that report

    var googCurrentDelayMs = rtcStatsReports[7].stat('googCurrentDelayMs');
    console.log(googCurrentDelayMs); // finally - googCurrentDelayMs :-)
})

Answer 2

I managed to solve this issue by delving into various Google community threads (thread 1, thread2):

var peerjs = new Peer(...); // initializing PeerJS
var connections = peerjs.connections;

The 'connections' variable is an object:

Object {2e1c5694-e6ef-e1b2-22d5-84a3807961d4: Array[3]}
    2e1c5694-e6ef-e1b2-22d5-84a3807961d4: Array[3]
        0: DataConnection
        1: MediaConnection
        2: MediaConnection
        length: 3
    __proto__: Array[0]
__proto__: Object

You can inspect any of these connection objects:

var rtcPeerConn = connectionObject.pc; // RTCPeerConnection

rtcPeerConn.getStats(function callback(connStats){
    var rtcStatsReports = connStats.result(); // an array of available status reports
    // Each status report object contains multiple variables, like googCurrentDelayMs.
    // You'll need to iterate through the objects and check their names to find the desired report.
    rtcStatsReports[7].names(); // returns all available variables for that report

    var googCurrentDelayMs = rtcStatsReports[7].stat('googCurrentDelayMs');
    console.log(googCurrentDelayMs); // finally - googCurrentDelayMs :-)
})

Answer 3

Answer №2

After conducting extensive research, I was able to successfully retrieve data from the PC using the Twilio SDK.

var rtcPeerConn =Twilio.Device.activeConnection();
rtcPeerConn.options.mediaStreamFactory.protocol.pc.getStats(function callback(report) {
                var rtcStatsReports = report.result();
                for (var i=0; i<rtcStatsReports.length; i++) {
                    var statNames = rtcStatsReports[i].names();
                    // filtering ICE stats
                    if (statNames.indexOf("transportId") > -1) {
                        var logs = "";
                        for (var j=0; j<statNames.length; j++) {
                            var statName = statNames[j];
                            var statValue = rtcStatsReports[i].stat(statName);
                            logs = logs + statName + ": " + statValue + ", ";
                        }
                        console.log(logs);
                    }
                }
            });

//Calculate error rate: Packetlost / packetsent

var rtcPeerConn =Twilio.Device.activeConnection();
rtcPeerConn.options.mediaStreamFactory.protocol.pc.getStats(function callback(report) {
                var error, pcksent;
                var rtcStatsReports = report.result();
                for (var i=0; i<rtcStatsReports.length; i++) {
                    var statNames = rtcStatsReports[i].names();
                    // filtering ICE stats
                    if (statNames.indexOf("packetsSent") > -1) {
                        var logs = "";
                        for (var j=0; j<statNames.length; j++) {
                            var statName = statNames[j];
                            var statValue = rtcStatsReports[i].stat(statName);
                            if(statName=="packetsLost")
                              error= statValue;
                            if(statName =="packetsSent")
                              pcksent = statValue;
                            logs = logs +"n:" +statName + ": " + statValue + ", ";
                        }
                        console.log(error/pcksent);
                    }
                }

            });

Answer 4

After conducting extensive research, I was able to successfully retrieve data from the PC using the Twilio SDK.

var rtcPeerConn =Twilio.Device.activeConnection();
rtcPeerConn.options.mediaStreamFactory.protocol.pc.getStats(function callback(report) {
                var rtcStatsReports = report.result();
                for (var i=0; i<rtcStatsReports.length; i++) {
                    var statNames = rtcStatsReports[i].names();
                    // filtering ICE stats
                    if (statNames.indexOf("transportId") > -1) {
                        var logs = "";
                        for (var j=0; j<statNames.length; j++) {
                            var statName = statNames[j];
                            var statValue = rtcStatsReports[i].stat(statName);
                            logs = logs + statName + ": " + statValue + ", ";
                        }
                        console.log(logs);
                    }
                }
            });

//Calculate error rate: Packetlost / packetsent

var rtcPeerConn =Twilio.Device.activeConnection();
rtcPeerConn.options.mediaStreamFactory.protocol.pc.getStats(function callback(report) {
                var error, pcksent;
                var rtcStatsReports = report.result();
                for (var i=0; i<rtcStatsReports.length; i++) {
                    var statNames = rtcStatsReports[i].names();
                    // filtering ICE stats
                    if (statNames.indexOf("packetsSent") > -1) {
                        var logs = "";
                        for (var j=0; j<statNames.length; j++) {
                            var statName = statNames[j];
                            var statValue = rtcStatsReports[i].stat(statName);
                            if(statName=="packetsLost")
                              error= statValue;
                            if(statName =="packetsSent")
                              pcksent = statValue;
                            logs = logs +"n:" +statName + ": " + statValue + ", ";
                        }
                        console.log(error/pcksent);
                    }
                }

            });

Is it possible to access the chrome://webrtc-internals/ variables through an API in JavaScript?

Answer №1

Answer №2

Similar questions

What is the best way to arrange the elements of an array based on a specified value?

What is the best way to establish a global database connection in express 4 router using express.Router()?

Experiencing problems with the Datepicker and cloning functionality in JQuery?

Issue: Reactjs - Material-UI HTML Tooltip does not display dynamic HTML content.In the Reactjs

What could be the reason for the malfunctioning of the "subscribe" button?

It appears that when filtering data in Angular from Web Api calls, there is a significant amount of data cleaning required

Designing multiple button actions in v-card-actions in Vuetify: A step-by-step guide

What method can I use to ensure that the sidebar stays fixed at a particular div as the user continues to scroll down the

Methods for breaking down a number into individual elements within an array

Selection auto-closing feature

Check to see if there is a value present in a JavaScript array

Retrieve the elements by their IDs in an svg where the ID equals '@data[]'

Showing the Length of Several Videos Simultaneously on a Webpage

Screen JSON data by applying filters

What is the best way to erase information displayed when hovering over an element using mouseout?

What steps can be taken to ensure that the v-model input is not updated?

The issue I am facing is that when I click on a checkbox, only one of them seems to respond

Steps to include a title next to a progress bar:

Developing a pop-up feature that triggers upon clicking for a miniature rich text editing

Navigating through this object with PUG and Express: a step-by-step guide