Start · Sprachen · JavaScript · Referenz · PresentationConnectionCloseEvent

PresentationConnectionCloseEvent

Schnittstelle

Ereignisobjekt der Presentation API, das beim Schließen einer <code>PresentationConnection</code> als <code>close</code>-Event ausgelöst wird und Grund sowie Meldung liefert.

seit JavaScript Experimentell – nur Chromium-basierte Browser (Chr Kategorie: webapi

Signatur

interface PresentationConnectionCloseEvent extends Event

Beschreibung

PresentationConnectionCloseEvent ist das Ereignisobjekt, das der Browser an eine PresentationConnection schickt, sobald die Verbindung zwischen steuernder Seite (Controller) und Präsentationsseite (Receiver, z. B. ein Zweitbildschirm oder Chromecast) geschlossen wird. Es erweitert Event um zwei schreibgeschützte Eigenschaften: reason und message.

Über reason erfährst du, warum die Verbindung beendet wurde:

  • "closed" – die Verbindung wurde bewusst über connection.close() geschlossen (auf einer der beiden Seiten).
  • "wentaway" – der Browser hat die Präsentation beendet oder das Gerät ist nicht mehr erreichbar (z. B. Netzwerkverlust, Seite geschlossen).
  • "error" – ein unerwarteter Fehler ist aufgetreten, z. B. ein Protokollfehler.

Die Eigenschaft message enthält eine menschenlesbare, aber implementierungsabhängige Beschreibung. Sie eignet sich für Logging, sollte aber nicht programmatisch ausgewertet werden. Typischer Einsatz: Benutzeroberfläche zurücksetzen, einen Wiederverbindungsversuch starten (nur bei "wentaway" sinnvoll) oder Fehler protokollieren.

Im Unterschied zu terminate bedeutet close nicht zwangsläufig, dass die Präsentation beendet ist – bei "closed" oder "wentaway" kann sie weiterlaufen und über PresentationRequest.reconnect() erneut verbunden werden.

Parameter

Name Typ Default Beschreibung
$type Pflicht string Name des Ereignisses, in der Praxis immer "close".
$eventInitDict Pflicht { reason: "error" | "closed" | "wentaway", message?: string, bubbles?: boolean, cancelable?: boolean, composed?: boolean } Initialisierungsobjekt. reason ist Pflicht; message ist optional (Standard: ""). Zusätzlich die üblichen EventInit-Felder.

Rückgabewert

Typ
PresentationConnectionCloseEvent
Beschreibung
Ein neues Ereignisobjekt mit den schreibgeschützten Eigenschaften reason (string) und message (string).

Beispiele

Auf das Schließen einer Präsentationsverbindung reagieren (addEventListener)

const request = new PresentationRequest(['receiver.html']);

document.querySelector('#cast').addEventListener('click', async () => {
  try {
    const connection = await request.start();

    connection.addEventListener('close', (event) => {
      // event ist ein PresentationConnectionCloseEvent
      console.log(`Verbindung geschlossen: ${event.reason}`);
      if (event.message) console.log(`Details: ${event.message}`);
      document.body.classList.remove('is-casting');
    });

    document.body.classList.add('is-casting');
  } catch (err) {
    console.error('Präsentation konnte nicht gestartet werden:', err);
  }
});
Verbindung geschlossen: closed

Nach Verbindungsverlust automatisch wiederverbinden (onclose)

const request = new PresentationRequest(['receiver.html']);

const watchConnection = (connection) => {
  // Presentation-ID merken, um später reconnect() nutzen zu können
  localStorage.setItem('presentationId', connection.id);

  connection.onclose = async ({ reason, message }) => {
    console.warn(`close: ${reason} – ${message}`);

    if (reason === 'wentaway') {
      try {
        const id = localStorage.getItem('presentationId');
        const again = await request.reconnect(id);
        watchConnection(again);
        console.log('Wieder verbunden');
      } catch {
        console.log('Wiederverbindung fehlgeschlagen');
      }
    }
  };
};

document.querySelector('#cast').onclick = async () => {
  watchConnection(await request.start());
};
close: wentaway – ... Wieder verbunden

Ereignis manuell erzeugen (z. B. für Tests)

if ('PresentationConnectionCloseEvent' in window) {
  const event = new PresentationConnectionCloseEvent('close', {
    reason: 'error',
    message: 'Simulierter Protokollfehler'
  });
  console.log(event.type, event.reason, event.message);
} else {
  console.log('Presentation API wird nicht unterstützt');
}
close error Simulierter Protokollfehler

// Wichtig · Fallstricke

  • Browser-Kompatibilität: Die Presentation API ist experimentell und praktisch nur in Chromium-Browsern (Chrome, Edge) verfügbar; Firefox und Safari unterstützen sie nicht. Vor der Nutzung immer mit 'PresentationRequest' in window prüfen.
  • Nur in sicheren Kontexten (HTTPS) verfügbar; request.start() erfordert zudem eine Nutzerinteraktion (z. B. Klick).
  • Der Inhalt von message ist browserabhängig und nicht standardisiert – für Programmlogik ausschließlich reason auswerten.
  • close ist nicht dasselbe wie terminate: Nach "closed" oder "wentaway" kann die Präsentation noch laufen. Nach terminate() ist eine Wiederverbindung nicht mehr möglich.
  • Den Handler registrieren, bevor die Verbindung schließen kann – sonst geht das Ereignis verloren. Nach dem Schließen hat connection.state den Wert "closed".