RTCPeerConnection:track 事件
當新的 track 已新增到連線的 RTCRtpReceiver 時,會向 RTCPeerConnection 上的 ontrack 事件處理程式傳送 track 事件。 在此事件送達時,新的 track 已完全新增到 peer connection。 更多詳情請參閱 Track 事件型別。
在傳送此事件時,新的 track 已完全新增到 peer connection。 更多詳情請參閱 Track 事件型別。
此事件不可取消,也不會冒泡。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱,或設定事件處理程式屬性。
js
addEventListener("track", (event) => { })
ontrack = (event) => { }
事件型別
一個 RTCTrackEvent。 繼承自 Event。
事件屬性
由於 RTCTrackEvent 基於 Event,因此其屬性也可用。
receiver只讀-
新增到
RTCPeerConnection的 track 所使用的RTCRtpReceiver。 streams只讀 可選-
一個
MediaStream物件陣列,每個物件代表已新增的track所屬的媒體流之一。 預設情況下,陣列為空,表示一個無流的 track。 track只讀-
已新增到連線的
MediaStreamTrack。 transceiver只讀-
新 track 正在使用的
RTCRtpTransceiver。
示例
此示例程式碼展示瞭如何建立一個新的 RTCPeerConnection,然後新增一個 track 事件處理程式。
js
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;
});
事件處理程式將新 track 的第一個流分配給一個現有的 <video> 元素,該元素使用變數 videoElement 標識。
您也可以將事件處理函式分配給 ontrack 屬性,而不是使用 addEventListener()。
js
pc.ontrack = (e) => {
videoElement.srcObject = e.streams[0];
hangupButton.disabled = false;
return false;
};
規範
| 規範 |
|---|
| WebRTC:瀏覽器中的即時通訊 # event-track |
瀏覽器相容性
載入中…