@testrtc/watchrtc-sdk
Advanced tools
Monitor your WebRTC application by collecting WebRTC statistics from end users
watchRTC enables application developers to collect, track and analyze telemetry and metrics of real users on any WebRTC application. This is done by including our watchRTC SDK which connects to the testRTC backend and collects the relevant data. Please check out our watchRTC knowledge base to learn more about the features and capabilities of this WebRTC monitoring service.
npm install @testrtc/watchrtc-sdk
yarn add @testrtc/watchrtc-sdk
<script src="https://unpkg.com/@testrtc/watchrtc-sdk/lib/index.js"></script>
Before any of your WebRTC javascript code, you need to include and initialize our SDK.
The watchRTC.init() needs to take place prior to including or loading any 3rd party SDKs that interact with WebRTC - failing to do so may hinder our ability to collect data. Use the following initialization sequence:
const watchRTC = require("@testrtc/watchrtc-sdk");
watchRTC.init();
import watchRTC from "@testrtc/watchrtc-sdk";
watchRTC.init();
with CDN
<!DOCTYPE html>
<html lang="en">
<head>
<title>watchRT SDK</title>
</head>
<body>
<script src="https://unpkg.com/@testrtc/watchrtc-sdk/lib/index.js"></script>
<script>
watchRTC.init();
</script>
</body>
</html>
Before you start, be sure to also read our Getting started with watchRTC guide. Configuring the SDK to connect to the watchRTC backend requires passing the following parameters to the SDK:
watchRTC.init()watchRTC.setConfig()RTCPeerConnection()Passing configuration parameters in the init() is the direct/easy way to provide this information. This is useful if you are planning to use a known/specific roomId for this session. The disadvantage of this approach is that it is rigid, and doesn't allow much flexibility. You can call the init() function multiple times but it will be initialized only on the first call.
watchRTC.init({
rtcApiKey: "watchRTC API key",
rtcRoomId: "identifier for the session",
rtcPeerId: "identifier for the current peer",
keys: { key1: "value1", key2: "value2" },
console: { level: "error", override: true },
proxyUrl: { "wss://{your-proxy}"}
});
You can call init() multiple times, but it will be initialized only at the first time. Following calls will be ignored.
You can use watchRTC.setConfig() function to set watchRTC configuration after calling watchRTC.init() and before the creation of RTCPeerConnection objects.
This approach is useful if you don't have the information needed in your watchRTC.init() call or when you don't have direct/easy access to the RTCPeerConnection objects (for example, when using a third party CPaaS SDK).
If needed, you can pass the rtcApiKey in the watchRTC.init() call while passing the rtcRomId, rtcPeerId and keys in the watchRTC.setConfig() call.
You can call this function multiple times, usually whenever a new session/room needs to be created or entered.
watchRTC.setConfig({
rtcApiKey: "watchRTC API key",
rtcRoomId: "identifier for the session",
rtcPeerId: "identifier for the current peer",
keys: { key1: "value1", key2: "value2" },
console: { level: "error", override: true },
});
If you have direct access to the RTCPeerConnection object creation, then you can add the necessary configuration parameters there. This gives you the highest level of control over what is done.
var pc = new RTCPeerConnection({
...,
watchrtc:{
rtcApiKey: "watchRTC API key",
rtcRoomId: "identifier for the session",
rtcPeerId: "identifier for the current peer",
keys: { key1: "value1", key2: "value2" },
console: { level: "error", override: true }
}
});
By default, watchRTC SDK will automatically establish a connection with the watchRTC server and close it after an idle period. At times, it might make sense for your application to manually open and close that connection explicitly. This is done by calling watchRTC.connect() and watchRTC.disconnect(). Read more about manually connecting/disconnecting to watchRTC servers.
watchRTC.connect();
watchRTC.disconnect();
You can also add keys to a room after joining the room. This can be done by calling watchRTC.addKeys() function.
Returns a Promise which resolves with an empty object in success case, or with an error property if something went wrong.
watchRTC.addKeys({ key1: "value1", key2: "value2" });
When needed, you can temporarily disable data collection. This is important for example if you want to conduct a pre-call test but you aren't interesting in collecting that data.
For that, you can use watchRTC.enableDataCollection() and watchRTC.disableDataCollection() to control what data you want to send.
You can collect the user's feedback as well. This can be done by calling watchRTC.setUserRating().
Returns a Promise which resolves with an empty object in success case, or with an error property if something went wrong.
watchRTC.setUserRating(5, "the best video quality I ever experienced!");
You can add your own events to the graphs and event logs. This enables you to monitor specific activity that you are interested in that is outside the generic scope of how WebRTC operates but part of your application logic. This is done by calling watchRTC.addEvent().
Returns a Promise which resolves with an empty object in success case, or with an error property if something went wrong.
Read more about adding custom events in watchRTC.
watchRTC.addEvent({ name: "my event", type: "global", parameters: { param1: "value1" } });
By default, watchRTC will assign the SSRC information as the name for incoming channels. You can change these to human-readable format indicating the source of the channels by mapping their streams. This is done by calling watchRTC.mapStream('). Read more about mapping streams in watchRTC.
watchRTC.mapStream("lyk0zS1eyvZfJRLis3OIwBx3UvH3:oxrhEtb3sV7VutbQ:video", "User A");
Additional samples on how to integrate the watchRTC SDK can be found on our official github reporistory: https://github.com/testRTC/sample-Twilio-video-app-React-TypeScript-watchRTC
watchRTC.addTags() was addedwatchRTC.setUserRating() was addedwatchRTC.addTags() was deprecated. We no longer support tags. These have been replaced with a key/value systemwatchRTC.addKeys() was added. Read more about keys in watchRTCwatchRTC.mapStream() was added. Read more about mapping streams in watchRTCwatchRTC.addEvent() was added. Read more about events in watchRTCwatchRTC.addEvent() now also supports parametersawait on the following SDK methods: addKeys(), setUserRating(), addEvent(). These methods now return a Promise which resolves with an empty object on success case, or with an error property if something went wrongFAQs
Monitor your WebRTC application by collecting WebRTC statistics from end users
The npm package @testrtc/watchrtc-sdk receives a total of 3,316 weekly downloads. As such, @testrtc/watchrtc-sdk popularity was classified as popular.
We found that @testrtc/watchrtc-sdk demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Malicious npm package postcss-optimizer delivers BeaverTail malware, targeting developer systems; similarities to past campaigns suggest a North Korean connection.
Security News
CISA's KEV data is now on GitHub, offering easier access, API integration, commit history tracking, and automated updates for security teams and researchers.
Security News
Opengrep forks Semgrep to preserve open source SAST in response to controversial licensing changes.