RTCPeerConnection: track Ereignis
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Das track
-Ereignis wird an den ontrack
-Ereignishandler auf RTCPeerConnection
s gesendet, nachdem ein neuer Track zu einem RTCRtpReceiver
hinzugefügt wurde, der Teil der Verbindung ist.
Zum Zeitpunkt der Zustellung dieses Ereignisses wurde der neue Track vollständig zur Peer-Verbindung hinzugefügt. Einzelheiten finden Sie unter Track-Ereignistypen.
Dieses Ereignis kann nicht abgebrochen werden und es wird nicht gebubbelt.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener()
oder setzen Sie eine Ereignishandler-Eigenschaft.
addEventListener("track", (event) => {});
ontrack = (event) => {};
Ereignistyp
Ein RTCTrackEvent
. Erbt von Event
.
Ereigniseigenschaften
Da RTCTrackEvent
auf Event
basiert, sind dessen Eigenschaften ebenfalls verfügbar.
receiver
Schreibgeschützt-
Der
RTCRtpReceiver
, der von dem hinzugefügten Track zurRTCPeerConnection
verwendet wird. streams
Schreibgeschützt Optional-
Ein Array von
MediaStream
-Objekten, die jeweils einen der Medienströme darstellen, zu denen der hinzugefügtetrack
gehört. Standardmäßig ist das Array leer, was auf einen streamlosen Track hinweist. track
Schreibgeschützt-
Der
MediaStreamTrack
, der zur Verbindung hinzugefügt wurde. transceiver
Schreibgeschützt-
Der
RTCRtpTransceiver
, der vom neuen Track verwendet wird.
Beispiele
Dieses Beispiel zeigt Code, der eine neue RTCPeerConnection
erstellt und dann einen neuen track
-Ereignishandler hinzufügt.
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,
);
Der Ereignishandler ordnet den ersten Stream des neuen Tracks einem bestehenden <video>
-Element zu, das mit der Variablen videoElement
identifiziert wird.
Sie können die Ereignishandlungsfunktion auch der ontrack
-Eigenschaft zuweisen, anstatt addEventListener()
zu verwenden.
pc.ontrack = (e) => {
videoElement.srcObject = e.streams[0];
hangupButton.disabled = false;
return false;
};
Spezifikationen
Specification |
---|
WebRTC: Real-Time Communication in Browsers # event-track |
Browser-Kompatibilität
BCD tables only load in the browser