PresentationConnection.send() — Methode · JavaScript-Referenz

Signatur

PresentationConnection.prototype.send(data)

Beschreibung

Mit send() überträgt man Nachrichten über eine PresentationConnection der Presentation API. Eine steuernde Seite, etwa eine Fernbedienungs-App auf dem Laptop, kann damit Befehle an die präsentierende Seite auf einem zweiten Bildschirm, Beamer oder Chromecast schicken. Umgekehrt kann auch die präsentierende Seite über ihre Verbindung Daten an die steuernde Seite zurücksenden.

Man kann Zeichenketten, Blob, ArrayBuffer oder ArrayBufferView-Werte (z. B. Uint8Array) übergeben. Auf der Gegenseite kommen die Daten im message-Event an. Bei Binärdaten legt die Eigenschaft binaryType ("arraybuffer" oder "blob") fest, in welcher Form sie ankommen. Objekte schickt man in der Regel als JSON-Text, also vorher mit JSON.stringify() umwandeln.

Senden ist nur möglich, solange connection.state den Wert "connected" hat. In jedem anderen Zustand ("connecting", "closed", "terminated") wirft die Methode eine InvalidStateError-DOMException. Deshalb wartet man vor dem ersten Senden auf das connect-Event.

Parameter

Name	Typ	Default	Beschreibung
$data Pflicht	string \| Blob \| ArrayBuffer \| ArrayBufferView		Die zu sendenden Daten: Text (z. B. JSON) oder Binärdaten.

Rückgabewert

Typ

void

Beschreibung

Kein Rückgabewert (undefined). Ob die Daten angekommen sind, wird nicht gemeldet.

Beispiele

Präsentation starten und Befehl senden (steuernde Seite)

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

const startButton = document.querySelector('#start');
startButton.addEventListener('click', async () => {
  try {
    const connection = await request.start();
    connection.addEventListener('connect', () => {
      // Erst senden, wenn die Verbindung steht
      connection.send(JSON.stringify({ action: 'goto', slide: 1 }));
      console.log('Befehl gesendet, Status:', connection.state);
    });
  } catch (err) {
    console.error('Präsentation fehlgeschlagen:', err.name);
  }
});

Befehl gesendet, Status: connected

Nachrichten empfangen und beantworten (präsentierende Seite)

// slides.html auf dem zweiten Bildschirm
const addConnection = (connection) => {
  connection.addEventListener('message', (event) => {
    const msg = JSON.parse(event.data);
    if (msg.action === 'goto') {
      console.log('Wechsle zu Folie', msg.slide);
      connection.send(JSON.stringify({ ack: true, slide: msg.slide }));
    }
  });
};

navigator.presentation.receiver.connectionList.then((list) => {
  list.connections.forEach(addConnection);
  list.addEventListener('connectionavailable', (e) => addConnection(e.connection));
});

Wechsle zu Folie 1

Sicher senden mit Zustandsprüfung und Binärdaten

const safeSend = (connection, data) => {
  if (connection.state !== 'connected') {
    console.warn('Nicht verbunden:', connection.state);
    return false;
  }
  try {
    connection.send(data);
    return true;
  } catch (err) {
    console.error(err.name); // z. B. InvalidStateError
    return false;
  }
};

// Binärdaten, z. B. Koordinaten eines Laserpointers
const coords = new Float32Array([0.42, 0.77]);
// safeSend(connection, coords.buffer);

// Wichtig · Fallstricke

Browserunterstützung: Die Presentation API ist experimentell und praktisch nur in Chromium-Browsern (Chrome, Edge) verfügbar. Firefox und Safari unterstützen sie nicht. Vorher mit 'PresentationRequest' in window prüfen.
Nur in sicherem Kontext: Die API funktioniert nur über HTTPS. Außerdem muss start() durch eine Nutzeraktion ausgelöst werden, etwa einen Klick.
Verbindungszustand: Ist state nicht "connected", wirft send() einen InvalidStateError. Tritt beim Senden ein Fehler auf, wird die Verbindung mit dem Grund "error" geschlossen, und es feuert ein close-Event.
Keine Zustellgarantie: Es gibt keine Rückmeldung, ob eine Nachricht angekommen ist. Wenn das wichtig ist, eigene Bestätigungen (ACK) einbauen.
Sicherheit: Eingehende Nachrichten auf der Gegenseite als nicht vertrauenswürdig behandeln. JSON.parse in try/catch setzen und den Inhalt nie ungeprüft in innerHTML einfügen.

Siehe auch

PresentationConnection PresentationConnection.state PresentationConnection.binaryType PresentationConnection.close() PresentationRequest.start() new HIDConnectionEvent()