RTCPeerConnection:datachannel 事件

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2020 年 1 月⁩ 起,所有主流瀏覽器均已支援。

當一個 RTCDataChannel 被新增到 RTCPeerConnection 例項中時,會向該例項傳送一個 datachannel 事件。這通常發生在遠端對等方呼叫 RTCPeerConnection.createDataChannel() 時。

注意: 當連線的本地端建立通道時,不會 觸發此事件。

此事件不可取消,也不會冒泡。

語法

在諸如 addEventListener() 之類的方法中使用事件名稱,或設定事件處理程式屬性。

js
addEventListener("datachannel", (event) => { })

ondatachannel = (event) => { }

事件型別

一個 RTCDataChannelEvent。繼承自 Event

Event RTCDataChannelEvent

事件屬性

也繼承自 Event 的屬性。

channel 只讀

返回與該事件關聯的 RTCDataChannel

示例

此示例設定了一個函式來處理 datachannel 事件,該函式透過收集與新新增的 RTCDataChannel 通訊所需的資訊,併為該通道上發生的事件新增事件處理程式。

js
pc.addEventListener("datachannel", (ev) => {
  receiveChannel = ev.channel;
  receiveChannel.onmessage = myHandleMessage;
  receiveChannel.onopen = myHandleOpen;
  receiveChannel.onclose = myHandleClose;
});

receiveChannel 被設定為事件的 channel 屬性的值,該屬性指定了代表連線遠端對等方和本地對等方的資料通道的 RTCDataChannel 物件。

這段相同的程式碼也可以使用 RTCPeerConnection 介面的 ondatachannel 事件處理程式屬性來實現,如下所示:

js
pc.ondatachannel = (ev) => {
  receiveChannel = ev.channel;
  receiveChannel.onmessage = myHandleMessage;
  receiveChannel.onopen = myHandleOpen;
  receiveChannel.onclose = myHandleClose;
};

規範

規範
WebRTC:瀏覽器中的即時通訊
# dom-rtcpeerconnection-ondatachannel

瀏覽器相容性

另見