Baseline Widely available
The track
event is sent to the ontrack
event handler on RTCPeerConnection
s after a new track has been added to an RTCRtpReceiver
which is part of the connection.
By the time this event is delivered, the new track has been fully added to the peer connection. See Track event types for details.
This event is not cancellable and does not bubble.
SyntaxUse the event name in methods like addEventListener()
, or set an event handler property.
addEventListener("track", (event) => { })
ontrack = (event) => { }
Event type Event properties
Since RTCTrackEvent
is based on Event
, its properties are also available.
receiver
Read only
The RTCRtpReceiver
used by the track that's been added to the RTCPeerConnection
.
streams
Read only Optional
An array of MediaStream
objects, each representing one of the media streams to which the added track
belongs. By default, the array is empty, indicating a streamless track.
track
Read only
The MediaStreamTrack
which has been added to the connection.
transceiver
Read only
The RTCRtpTransceiver
being used by the new track.
This example shows code that creates a new RTCPeerConnection
, then adds a new track
event handler.
pc = new RTCPeerConnection({
iceServers: [
{
urls: "turn:fake.turn-server.url",
username: "some username",
credential: "some-password",
},
],
});
pc.addEventListener(
"track",
(e) => {
videoElement.srcObject = e.streams[0];
hangupButton.disabled = false;
},
false,
);
The event handler assigns the new track's first stream to an existing <video>
element, identified using the variable videoElement
.
You can also assign the event handler function to the ontrack
property, rather than use addEventListener()
.
pc.ontrack = (e) => {
videoElement.srcObject = e.streams[0];
hangupButton.disabled = false;
return false;
};
Specifications Browser compatibility
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.3