在本文中,我们将展示如何通过将所有 RTCPeerConnections 指标导出到 Prometheus 服务来简化 WebRTC 应用程序的调试过程。然后可以使用与 Prometheus 数据源链接的 Grafana 服务来检查导出的数据。
WebRTC-internals
通常,检查正在运行的 WebRTC 连接状态的常用方法是使用 chrome://webrtc-internals url,它提供了一个基本但非常详细的用户界面,可以检索每个 RTCPeerConnection 和 MediaStream 对象上的指标。webrtc-internals 页面的一些主要功能包括:
- 创建 RTCPeerConnection 和 MediaStreamTrack 对象的文件转储。利用该转储,开发人员可以调试和跟踪这些对象的状态和事件。
- 提供了所有 RTC 事件及其属性的列表,使开发人员能够了解事件的时间顺序及其详细信息。
- PeerConnection 日志和统计图表:对于每个 RTCPeerConnection,它都会提供不同统计信息的实时图表,如发送/接收的字节数、数据包丢失、抖动、延迟等。某些显示的指标(标签由[ ]括起)是计算的结果(如 bytesSent_in_bits/s)。
WebRTC-internals 提供的图形可视化仅限于过去五分钟,并且页面内的数据不是持久的。为了保留此数据,该页面允许用户生成 JSON 格式的文件,其中包含页面收集的所有数据:
https://fippo.github.io/webrtc-dump-importer/ 是加载 webrtc-internals dump 的一个非常有用的工具,它本质上是一个静态网页,可以加载 JSON dump,显示内部数据,并使用可定制的图表部件显示指标。
WebRTC-internals 限制
在转储创建/加载过程中使用 webrtc-internals 有一些限制:
- 需要在启动会议会话前打开 chrome://webrtc-internals 页面;如果您正在运行一个现有会话并遇到问题,则无法在打开 webrtc-internals 页面前收集任何指标。
- 指标可视化的时间有限,而且无法对收集到的指标进行自定义、过滤或创建其他查询。
- 使用转储文件很难存储和组织测试数据并共享结果。在基于浏览器的工具中加载大型转储文件可能需要耗费大量时间和内存。
WebRTC Internals Exporter
它是一个 Chromium 扩展(安装链接),允许从每个浏览器页面内创建的所有 RTCPeerConnection 对象中收集 WebRTC 指标;该扩展不使用 Web 用户界面显示结果,而是将收集到的指标实时发送到 Prometheus PushGateway 服务 (https://prometheus.io/docs/practices/pushing)。此时,可以使用 Prometheus 查询语言或从 Prometheus 数据源读取数据的 Grafana 服务来探索度量指标。
扩展源代码可在此处获取: https: //github.com/vpalmisano/webrtc-internals-exporter。在同一个存储库中,您可以找到一个Grafana 仪表板,其中显示了扩展程序导出的一些基本指标:
扩展选项
安装后,您需要访问扩展选项页面,填写 Pushgateway URL 和用户名/密码(如果强制执行身份验证)。其他可选设置有:
- 更新间隔:它允许更改指标收集间隔(以秒为单位)。
- 启用 gzip 压缩:不是必需的,但建议这样做,以减少通过网络发送的数据量;Pushgateway 从1.5.0版本开始支持。
- Pushgateway 作业名称:它允许自定义附加到每个指标的
job
标签。通常,您可以使用exported_job
标签选择器在 Grafana 中查询导出的标签。 - 启用 PeerConnection 统计信息:您可以在此指定要从
getStats
输出中收集的指标类型列表。 - 启用 URL 来源:您可以在此处查看允许的 URL 列表,扩展程序将在其中实际收集数据。
点击扩展图标打开的扩展菜单允许用户激活/禁用当前打开的标签页上的数据收集:
对当前标签页的选项或启用/禁用扩展的任何更改都将立即应用,而无需重新加载页面。
实施细节
该扩展预载了一段覆盖 RTCPeerConnection 全局类的 JavaScript 代码。新类会为所有已创建的对等连接对象分配一个随机 ID,并将其存储在 webrtcInternalExporter 对象中。用户可以点击扩展图标并激活复选框,为当前打开的选项卡启用扩展。之后,覆盖脚本将开始定期调用已创建的对等连接对象上的 getStats 方法。所有选定的指标都将被发送到后台脚本,该脚本将把它们发布到配置的 Pushgateway 服务。
打开受监控页面的开发人员面板,可以启用扩展调试日志,在控制台中显示返回的 getStats 值的内容:
localStorage.setItem("webrtc-internal-exporter:debug", "true")
此外,还可以使用 webrtcInternalExporter 对象访问已创建的对等连接对象:
> webrtcInternalExporter.peerConnections
Map(1) {'b03c3616-3f91-42b5-85df-7dbebefae8bd' => RTCPeerConnection}
使用 getStats
方法收集的 WebRTC 统计数据将具有类似下面的 JSON 结构:
{
"id": "OT01V63622934",
"timestamp": 1700935185762.758,
"type": "outbound-rtp",
"codecId": "COT01_98_profile-id=0;useadaptivelayering=true;useadaptivelayering_v2=true",
"kind": "video",
"mediaType": "video",
"ssrc": 63622934,
"transportId": "T01",
"bytesSent": 9602443,
"packetsSent": 18815,
"active": true,
"encoderImplementation": "libvpx",
"firCount": 0,
"frameHeight": 180,
"frameWidth": 320,
"framesEncoded": 16097,
"framesPerSecond": 29,
"framesSent": 16097,
"headerBytesSent": 717385,
"hugeFramesSent": 2,
"keyFramesEncoded": 7,
"mediaSourceId": "SV2",
"mid": "1",
"nackCount": 1,
"pliCount": 0,
"powerEfficientEncoder": false,
"qpSum": 212295,
"qualityLimitationDurations": {
"bandwidth": 0.068,
"cpu": 0,
"none": 541.459,
"other": 0
},
"qualityLimitationReason": "none",
"qualityLimitationResolutionChanges": 0,
"remoteId": "RIV63622934",
"retransmittedBytesSent": 717,
"retransmittedPacketsSent": 1,
"rtxSsrc": 2624922651,
"scalabilityMode": "L3T3_KEY",
"targetBitrate": 142000,
"totalEncodeTime": 38.754,
"totalEncodedBytesTarget": 0,
"totalPacketSendDelay": 0.015203
}
该扩展将使用其余的字符串属性作为标签,将统计信息中的每个数值转换为 “度量 “度量类型。例如,outbound-rtp 统计信息中的 bytesSent 值将转换为名为 outbound_rtp_bytesSent 的度量类型,并使用其余字符串属性作为标签:
因此,我们可以使用导出的标签和指标名称运行各种 Grafana 查询:
结论
在本文中,我们介绍了一个 Chromium 扩展,可用于简化和改进 WebRTC 应用程序的测试过程。该扩展只是一个后台脚本,它可以从创建的对等连接中收集数据,并将这些数据实时发送到 Prometheus Pushgateway 服务。一旦这些数据被摄取到 Prometheus 中,您就可以使用 Grafana 服务在运行测试和/或分析后阶段检查这些数据。
作者:Vittorio Palmisano
本文来自作者投稿,版权归原作者所有。如需转载,请注明出处:https://www.nxrte.com/jishu/webrtc/38376.html