RTCDataChannel: close — Ereignis · JavaScript-Referenz

Signatur

dataChannel.addEventListener("close", handler)

Beschreibung

Das close-Event eines RTCDataChannel signalisiert, dass der Datenkanal endgültig geschlossen ist. Zu diesem Zeitpunkt hat readyState bereits den Wert "closed". Über den Kanal können keine Nachrichten mehr gesendet oder empfangen werden. Du registrierst es entweder mit addEventListener("close", handler) oder über die Eigenschaft onclose.

Das Event tritt in verschiedenen Situationen auf: Du rufst selbst dataChannel.close() auf, die Gegenseite schließt den Kanal, die zugehörige RTCPeerConnection wird mit close() beendet oder der SCTP-Transport bricht ab. Vorher wird in der Regel das Event closing ausgelöst, während der Kanal in den Zustand "closing" wechselt und noch gepufferte Daten überträgt.

Typische Einsatzzwecke sind das Aufräumen von Ressourcen (Timer, Referenzen, UI-Zustände), das Anzeigen eines „Verbindung getrennt“-Hinweises oder das Auslösen einer Wiederverbindungslogik. Das Event ist ein einfaches Event ohne zusätzliche Eigenschaften; es bubbelt nicht und kann nicht abgebrochen werden.

Parameter

Name	Typ	Default	Beschreibung
$type Pflicht	string		Der Event-Name `"close"`.
$handler Pflicht	(event: Event) => void		Callback, der ein einfaches `Event`-Objekt erhält. `event.target` ist der geschlossene `RTCDataChannel`.
$options	boolean \| AddEventListenerOptions	false	Optionale Listener-Optionen wie `once` oder `signal` (zum Entfernen per `AbortController`).

Rückgabewert

Typ

void

Beschreibung

addEventListener gibt nichts zurück. Der Handler erhält ein Event ohne spezielle Zusatzdaten.

Beispiele

Schließen eines Datenkanals mit addEventListener beobachten

const pc = new RTCPeerConnection();
const channel = pc.createDataChannel('chat');

channel.addEventListener('close', (event) => {
  console.log(`Kanal "${event.target.label}" geschlossen, Zustand: ${event.target.readyState}`);
});

// Später, z. B. beim Verlassen des Chats:
channel.close();

Kanal "chat" geschlossen, Zustand: closed

onclose-Property für Aufräumarbeiten und UI-Hinweis

const pc = new RTCPeerConnection();
const channel = pc.createDataChannel('telemetry');

let pingTimer = null;

channel.onopen = () => {
  pingTimer = setInterval(() => channel.send('ping'), 5000);
};

channel.onclose = () => {
  clearInterval(pingTimer);
  pingTimer = null;
  console.log('Verbindung getrennt – Ping-Timer gestoppt.');
};

// Handler wieder entfernen:
// channel.onclose = null;

Verbindung getrennt – Ping-Timer gestoppt.

Listener per AbortController entfernen und auf Remote-Kanäle reagieren

const pc = new RTCPeerConnection();
const controller = new AbortController();

pc.addEventListener('datachannel', ({ channel }) => {
  const onClose = () => {
    console.log(`Gegenseite hat "${channel.label}" geschlossen.`);
  };

  channel.addEventListener('closing', () => console.log('Kanal wird geschlossen …'), { signal: controller.signal });
  channel.addEventListener('close', onClose, { once: true, signal: controller.signal });
});

// Alle Listener auf einmal entfernen, z. B. beim Unmount einer Komponente:
// controller.abort();

Kanal wird geschlossen … Gegenseite hat "files" geschlossen.

// Wichtig · Fallstricke

Kein Fehler-Detail: Das close-Event verrät nicht, warum geschlossen wurde. Bei Abbrüchen durch Fehler wird vorher meist ein error-Event (RTCErrorEvent) ausgelöst. Werte das aus, um zwischen regulärem Schließen und Störung zu unterscheiden.
Daten gehen evtl. verloren: Nach close ist send() nicht mehr möglich (InvalidStateError). Prüfe vor dem Schließen bufferedAmount, wenn noch Daten unterwegs sein können.
PeerConnection schließen: Beim Aufruf von pc.close() lösen ältere Browser das close-Event der Kanäle teils nicht oder erst verzögert aus. Verlasse dich für Aufräumarbeiten zusätzlich auf connectionstatechange der RTCPeerConnection.
Erkennung eines Verbindungsabbruchs: Wenn das Netzwerk plötzlich wegfällt, kann es mehrere Sekunden dauern, bis SCTP den Abbruch erkennt und close auslöst. Für schnelle Erkennung eigene Heartbeats verwenden.
Kompatibilität: In Chrome, Firefox, Safari und Edge unterstützt. Das vorgelagerte closing-Event kam später hinzu und fehlt in älteren Firefox-Versionen.

Siehe auch

RTCDataChannel RTCDataChannel.close() RTCDataChannel.readyState RTCPeerConnection RTCDataChannel: closing RTCDataChannel: error