有人可以全面解释 WebRTC 统计数据 API 吗？

Question

我正在完成视频通信研究生课程的 WebRTC 项目，它本质上是一个视频会议聊天室。连接到服务器的每个人都被添加到会议中。

我需要使用 WebRTC 中的统计信息 API 来显示每个 RTCPeerConnection 的一些相关性能统计信息（每秒丢失的数据包、抖动、重传等）。这有助于观察性能成本，因为更多的对等方被添加到对话中。

然而 API 似乎还没有完全充实。它显然经过了一些更新，并且与我见过的一些 W3C 规范不太匹配（尽管它可能已经过时或者我只是不理解阅读规范的细微差别，这也不会让我感到惊讶）。

我对 API 的调用是 similar to this one，但解释数据并不简单。例如，当遍历 RTCStatsReport::results() 中的所有项目时，其中许多项目具有重复的名称和令人困惑的值。我似乎找不到有关它们含义的任何信息。如果有人能帮助我理解一些重要的或指出失落的黄金之城（例如适当的文档），我将不胜感激。

Answer 1

你的困惑的根源可能是 Google Chrome 对 getStats() 的实施早于标准并且尚未更新（你的例子 link 是 Chrome-特定的，所以我假设您使用的是 Chrome).

如果您尝试使用 Firefox，您会发现它实现了 getStats() 到 the standard（但是它还不支持标准中的所有统计数据，并且总体统计数据少于 Chrome的老API).

由于您没有指定浏览器，我将描述标准，并使用 Firefox 进行示例。您可能已经知道 getStats()，但标准的允许您过滤特定的 MediaStreamTrack，或者传入 null 以获取与连接关联的所有数据：

var pc = new RTCPeerConnection(config)
...
pc.getStats(null, function(stats) { ...}, function(error) { ... });

还有更新的 promise 版本。

数据在 stats 中返回，这是一个大雪球对象，每条记录都有唯一的 ID。每条记录有 the following base class:

dictionary RTCStats {
    DOMHiResTimeStamp timestamp;
    RTCStatsType      type;
    DOMString         id;
};

其中 id 是用于访问记录的属性名称的重复。派生类型描述为 here.

您通常会枚举记录，直到找到 RTCStatsType 感兴趣的记录，例如"inbound-rtp" 看起来像这样：

dictionary RTCRTPStreamStats : RTCStats {
         DOMString     ssrc;
         DOMString     remoteId;
         boolean       isRemote = false;
         DOMString     mediaTrackId;
         DOMString     transportId;
         DOMString     codecId;
         unsigned long firCount;
         unsigned long pliCount;
         unsigned long nackCount;
         unsigned long sliCount;
};

dictionary RTCInboundRTPStreamStats : RTCRTPStreamStats {
         unsigned long      packetsReceived;
         unsigned long long bytesReceived;
         unsigned long      packetsLost;
         double             jitter;
         double             fractionLost;
};

RTCOutboundRTPStreamStats有对应的。

您还可以遵循对其他记录的交叉引用。任何以 Id 结尾的成员都是外键，您可以使用它来查找另一条记录。例如，对于此 RTP 数据所属的轨道，mediaTrackId link 秒到 RTCMediaStreamTrackStats。

一个特别奇怪的情况是 RTCP 数据，它存储在与上面相同的字典中，这意味着您必须检查 isRemote == false 才能知道您正在查看 RTP 数据而不是 RTCP 数据。使用 remoteId 找到另一个（请注意，这是最近的名称更改，因此 Firefox 在这里仍然使用旧的 remoteId）。出站 RTP 的相关 RTCP 统计信息存储在入站字典中，反之亦然（有意义）。

这是在 Firefox 中运行的 an example：

var pc1 = new RTCPeerConnection(), pc2 = new RTCPeerConnection();

var add = (pc, can) => can && pc.addIceCandidate(can).catch(log);
pc1.onicecandidate = e => add(pc2, e.candidate);
pc2.onicecandidate = e => add(pc1, e.candidate);

pc2.oniceconnectionstatechange = () => update(statediv, pc2.iceConnectionState);
pc2.onaddstream = e => v2.srcObject = e.stream;

navigator.mediaDevices.getUserMedia({ video: true })
  .then(stream => pc1.addStream(v1.srcObject = stream))
  .then(() => pc1.createOffer())
  .then(offer => pc1.setLocalDescription(offer))
  .then(() => pc2.setRemoteDescription(pc1.localDescription))
  .then(() => pc2.createAnswer())
  .then(answer => pc2.setLocalDescription(answer))
  .then(() => pc1.setRemoteDescription(pc2.localDescription))
  .then(() => repeat(10, () => Promise.all([pc1.getStats(), pc2.getStats()])
    .then(([s1, s2]) => {
      var s = "";
      s1.forEach(stat => {
        if (stat.type == "outbound-rtp" && !stat.isRemote) {
          s += "<h4>Sender side</h4>" + dumpStats(stat);
        }
      });
      s2.forEach(stat => {
        if (stat.type == "inbound-rtp" && !stat.isRemote) {
          s += "<h4>Receiver side</h4>" + dumpStats(stat);
        }
      });
      update(statsdiv, "<small>"+ s +"</small>");
  })))
  .catch(failed);

function dumpStats(o) {
  var s = "";
  if (o.mozAvSyncDelay !== undefined || o.mozJitterBufferDelay !== undefined) {
    if (o.mozAvSyncDelay !== undefined) s += "A/V sync: " + o.mozAvSyncDelay + " ms";
    if (o.mozJitterBufferDelay !== undefined) {
      s += " Jitter buffer delay: " + o.mozJitterBufferDelay + " ms";
    }
    s += "<br>";
  }
  s += "Timestamp: "+ new Date(o.timestamp).toTimeString() +" Type: "+ o.type +"<br>";
  if (o.ssrc !== undefined) s += "SSRC: " + o.ssrc + " ";
  if (o.packetsReceived !== undefined) {
    s += "Recvd: " + o.packetsReceived + " packets";
    if (o.bytesReceived !== undefined) {
      s += " ("+ (o.bytesReceived/1024000).toFixed(2) +" MB)";
    }
    if (o.packetsLost !== undefined) s += " Lost: "+ o.packetsLost;
  } else if (o.packetsSent !== undefined) {
    s += "Sent: " + o.packetsSent + " packets";
    if (o.bytesSent !== undefined) s += " ("+ (o.bytesSent/1024000).toFixed(2) +" MB)";
  } else {
    s += "<br><br>";
  }
  s += "<br>";
  if (o.bitrateMean !== undefined) {
    s += " Avg. bitrate: "+ (o.bitrateMean/1000000).toFixed(2) +" Mbps";
    if (o.bitrateStdDev !== undefined) {
      s += " ("+ (o.bitrateStdDev/1000000).toFixed(2) +" StdDev)";
    }
    if (o.discardedPackets !== undefined) {
      s += " Discarded packts: "+ o.discardedPackets;
    }
  }
  s += "<br>";
  if (o.framerateMean !== undefined) {
    s += " Avg. framerate: "+ (o.framerateMean).toFixed(2) +" fps";
    if (o.framerateStdDev !== undefined) {
      s += " ("+ o.framerateStdDev.toFixed(2) +" StdDev)";
    }
  }
  if (o.droppedFrames !== undefined) s += " Dropped frames: "+ o.droppedFrames;
  if (o.jitter !== undefined) s += " Jitter: "+ o.jitter;
  return s;
}

var wait = ms => new Promise(r => setTimeout(r, ms));
var repeat = (ms, func) => new Promise(r => (setInterval(func, ms), wait(ms).then(r)));
var log = msg => div.innerHTML = div.innerHTML + msg +"<br>";
var update = (div, msg) => div.innerHTML = msg;
var failed = e => log(e.name +": "+ e.message +", line "+ e.lineNumber);

<table><tr><td>
  <video id="v1" width="124" height="75" autoplay></video><br>
  <video id="v2" width="124" height="75" autoplay></video><br>
  <div id="statediv"></div></td>
<td><div id="div"></div><br><div id="statsdiv"></div></td>
</tr></table>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>

要查看支持的内容，请执行 stats.forEach(stat => console.log(JSON.stringify(stat))) 以转储所有内容。难以阅读，但它就在那里。

我相信很快就会为 adapter.js 计划一个 polyfill 来弥合差距，直到 Chrome 更新它的实现。

更新： 我更新了示例以使用新的 maplike 语法，并更改了类型名称以包含破折号，以符合最新规范。

有人可以全面解释 WebRTC 统计数据 API 吗？

Can someone comprehensively explain the WebRTC stats API?

javascript

webrtc