Signatur
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 überconnection.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
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);
}
});
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());
};
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');
}
// 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 windowprüfen. - Nur in sicheren Kontexten (HTTPS) verfügbar;
request.start()erfordert zudem eine Nutzerinteraktion (z. B. Klick). - Der Inhalt von
messageist browserabhängig und nicht standardisiert – für Programmlogik ausschließlichreasonauswerten. closeist nicht dasselbe wieterminate: Nach"closed"oder"wentaway"kann die Präsentation noch laufen. Nachterminate()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.stateden Wert"closed".