How do I get information about the type of connection of a WebRTC PeerConnection?

Question

Is there any way to get information about the type of connection used in WebRTC in a programmatic way?

For example in my app I use local connections as well as STUN and TURN. From the ICE candidates I can gather if the type of the candidates is host or relay, and on the server I can see if the connection is attempted via STUN (connection initiation) or TURN (steady stream during connection).

Up until now I could not find a way to access the information about the finally used type of connection in the browser. There are the candidates, the browser stops gathering and then there is a working connection. Looking through the events I couldn't find any information though.

I know that Chrome supports getStats() on the peerconnection, which allows me access to most of the information found in chrome://webrtc-internals, however I didn't find this information there either.

Is there any way to access this information from javascript?

Thank you very much.

Answer 1

According to the specification, which is currently implemented in Firefox, but not in Chrome, you can indeed suss out the active candidate from the statistics available for candidate pairs, which are:

dictionary RTCIceCandidatePairStats : RTCStats {
    DOMString                     transportId;
    DOMString                     localCandidateId;
    DOMString                     remoteCandidateId;
    RTCStatsIceCandidatePairState state;
    unsigned long long            priority;
    boolean                       nominated;
    boolean                       writable;
    boolean                       readable;
    unsigned long long            bytesSent;
    unsigned long long            bytesReceived;
    double                        roundTripTime;
    double                        availableOutgoingBitrate;
    double                        availableIncomingBitrate;
};

Combined with the stats on the individual candidates:

dictionary RTCIceCandidateAttributes : RTCStats {
    DOMString                ipAddress;
    long                     portNumber;
    DOMString                transport;
    RTCStatsIceCandidateType candidateType;
    long                     priority;
    DOMString                addressSourceUrl;
};

Use peerConnection.getStats() to look for an ice candidate pair that is both nominated and has succeeded:

pc.getStats(null))
.then(function(stats) {
  return Object.keys(stats).forEach(function(key) {
    if (stats[key].type == "candidatepair" &&
        stats[key].nominated && stats[key].state == "succeeded") {
      var remote = stats[stats[key].remoteCandidateId];
      console.log("Connected to: " + remote.ipAddress +":"+
                  remote.portNumber +" "+ remote.transport +
                  " "+ remote.candidateType);
    }
  });
})
.catch(function(e) { console.log(e.name); });

This might output something like:

Connected to: 192.168.1.2:49190 udp host

which you could test against the LAN range. If instead it returned something like:

Connected to: 24.57.143.7:61102 udp relayed

then you'd have a TURN connection.

Here's a jsfiddle that shows this (requires Firefox Developer Edition for other reasons).

Answer 2

It took me a long time to get this right, so hopefully this helps someone.

The new way

You can now get the selected candidate pair from the RTCPeerConnection without the stats api:

const pair = rtcConnection.sctp.transport.iceTransport.getSelectedCandidatePair();
console.log(pair.remote.type);

At the time of writing (October 2, 2020) this only works in Chromium however. You can still use the stats api for other browsers. Also note the comment below by jib that this only works if you have a DataChannel.

For browsers without getSelectedCandidatePair() support

According to https://developer.mozilla.org/en-US/docs/Web/API/RTCIceCandidatePairStats (at the bottom of the page at the selected property.

The spec-compliant way to determine the selected candidate pair is to look for a stats object of type transport, which is an RTCTransportStats object. That object's selectedCandidatePairId property indicates whether or not the specified transport is the one being used.

So trying to find the selected pair using stat.nominated && stats.state == "succeeded" is not the right way to do it.

Instead, you can get it by looking at the selected pair in the transport stat. Firefox doesn't support this, but fortunately there is a non-standard selected property in candidate pairs for firefox.

const stats = await rtcConnection.getStats();
if(stats){
    let selectedPairId = null;
    for(const [key, stat] of stats){
        if(stat.type == "transport"){
            selectedPairId = stat.selectedCandidatePairId;
            break;
        }
    }
    let candidatePair = stats.get(selectedPairId);
    if(!candidatePair){
        for(const [key, stat] of stats){
            if(stat.type == "candidate-pair" && stat.selected){
                candidatePair = stat;
                break;
            }
        }
    }

    if(candidatePair){
        for(const [key, stat] of stats){
            if(key == candidatePair.remoteCandidateId){
                return stat.candidateType;
            }
        }
    }
}

Answer 3

jib's answer from March 2015 is very helpful, but doesn't work with Firefox v65 nor Chrome v72 (on Windows) in March 2019. Two updates are needed:

1) The "stats" value has type RTCStatsReport in both browsers now, and it's an iterable object with no keys. So, iterate it with forEach(report => {...}) and "report" will be an object with keys like those that jib shows for "stats".

2) "candidatepair" isn't a valid value of report.type but "candidate-pair" is.

Answer 4

Thanks to @DavidP and a more in-depth answer I wrote the code below to get the ICE Candidates type.

Updated Code: Getting the ICE candidates with conncectionStats

    function getCandidateIds(stats) {
        let ids = {}
        stats.forEach(report => {
            if (report.type == "candidate-pair" && report.nominated && report.state == "succeeded") {
                //console.log("Found IDs")
                ids = {
                    localId: report.localCandidateId,
                    remoteId: report.remoteCandidateId
                }
            }
        });
        return ids
    }

    function getCandidateInfo(stats, candidateId) {
        let info = null
        stats.forEach(report => {
            if (report.id == candidateId) {
                console.log("Found Candidate")
                info = report
            }
        })
        return info
    }

    async function conncectionStats() {
        const stats = await this.pc.getStats(null)
        const candidates = await this.getCandidateIds(stats)
        console.log("candidates: ", candidates)
        if (candidates !== {}) {
            const localCadidate = await this.getCandidateInfo(stats, candidates.localId)
            const remoteCadidate = await this.getCandidateInfo(stats, candidates.remoteId)
            if (localCadidate !== null && remoteCadidate !== null) {
                return [localCadidate, remoteCadidate]
            }
        }
        // we did not find the candidates for whatever reeason
        return [null, null]
    }

reading out IP:

  let myAddress = ""
  let peerAddress = ""
  if (localCadidate.hasOwnProperty("ip")){
    myAddress = localCadidate.ip
    peerAddress = remoteCadidate.ip
  } else {
    myAddress = localCadidate.address
    peerAddress = remoteCadidate.address
  }

old version:

function getConnectionDetails(pc){
  pc.getStats(null)
  .then(function(stats) {
        stats.forEach(report => {
          if (report.type == "candidate-pair" 
              && report.nominated 
              && report.state == "succeeded")
          {
            console.log( "Local ICE:", report.localCandidateId)
            console.log( "Remote ICE:",report.remoteCandidateId)
            getCandidates(pc, report.localCandidateId, report.remoteCandidateId)
          }
      });
  })
  .catch(function(e) { console.log(e.name); });
};

function getCandidates(pc, localId, remoteId){
  //console.log("looking for candidates")
  pc.getStats(null)
  .then(function(stats) {
        stats.forEach(report => {
          if (report.id == localId) {
              console.log("Local: Type:", report.candidateType," IP:", report.ip)
          } else if (report.id == remoteId){
              console.log("Remote: Type:", report.candidateType," IP:", report.ip)
          }
      })
  })
  .catch(function(e) { console.log(e.name); });
}

You may not need both candidates depending on what information should be extracted.