RTCPeerConnection: connectionstatechange event

The connectionstatechange event is sent to the onconnectionstatechange event handler on an RTCPeerConnection object after a new track has been added to an RTCRtpReceiver which is part of the connection. The new connection state can be found in connectionState, and is one of the string values: new, connecting, connected, disconnected, failed, or closed.

Bubbles No
Cancelable No
Interface Event
Event handler onconnectionstatechange

Examples

For an RTCPeerConnection, pc, this example sets up a handler for connectionstatechange messages to handle changes to the connectivity of the WebRTC session. It calls an app-defined function called setOnlineStatus() to update a status display.

pc.onconnectionstatechange = ev => {
  switch(pc.connectionState) {
    case "new":
    case "checking":
      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;
  }
}

You can also create a handler for connectionstatechange by using addEventListener():

pc.addEventListener("connectionstatechange", ev => {
  switch(pc.connectionState) {
    /* ... */
  }
}, false);

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
connectionstatechange_event
72
79
No
No
60
11
72
72
No
51
No
11.0

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/connectionstatechange_event