RTCPeerConnection: connectionstatechange 事件

Baseline 2023
新推出

自 ⁨2023 年 5 月⁩起,此功能可在最新的裝置和瀏覽器版本上使用。此功能可能無法在舊版裝置或瀏覽器上使用。

RTCRtpReceiver(屬於連線的一部分)中添加了新的音軌後,就會向 RTCPeerConnection 物件上的 onconnectionstatechange 事件處理程式傳送 connectionstatechange 事件。新的連線狀態可以在 connectionState 中找到,它是一個字串值,可能是:newconnectingconnecteddisconnectedfailedclosed

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

語法

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

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

onconnectionstatechange = (event) => { }

事件型別

一個通用的 Event

示例

對於名為 peerConnectionRTCPeerConnection,此示例使用 addEventListener() 來處理 WebRTC 會話連線性的變化。它呼叫一個應用程式定義的函式 setOnlineStatus() 來更新狀態顯示。

js
peerConnection.addEventListener("connectionstatechange", (event) => {
  switch (peerConnection.connectionState) {
    case "new":
    case "connecting":
      setOnlineStatus("Connecting…");
      break;
    case "connected":
      setOnlineStatus("Online");
      break;
    case "disconnected":
      setOnlineStatus("Disconnecting…");
      break;
    case "closed":
      setOnlineStatus("Offline");
      break;
    case "failed":
      setOnlineStatus("Error");
      break;
    default:
      setOnlineStatus("Unknown");
      break;
  }
});

您也可以使用 RTCPeerConnection.onconnectionstatechange 屬性來建立 connectionstatechange 事件的事件處理程式。

js
peerConnection.onconnectionstatechange = (ev) => {
  switch (peerConnection.connectionState) {
    case "new":
    case "connecting":
      setOnlineStatus("Connecting…");
      break;
    // …
    default:
      setOnlineStatus("Unknown");
      break;
  }
};

規範

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

瀏覽器相容性

另見