SharedWorkerGlobalScope: connect-Ereignis

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Event-Handler-Eigenschaft.

addEventListener("connect", (event) => {});

onconnect = (event) => {};

Ein MessageEvent. Erbt von Event.

Diese Schnittstelle erbt auch Eigenschaften von ihrem Elternteil, Event.

MessageEvent.data Nur lesbar

Die vom Nachrichtensender gesendeten Daten.

MessageEvent.origin Nur lesbar

Ein String, der den Ursprung des Nachrichtensenders darstellt.

MessageEvent.lastEventId Nur lesbar

Ein String, der eine eindeutige ID für das Ereignis darstellt.

MessageEvent.source Nur lesbar

Eine MessageEventSource (die ein WindowProxy, ein MessagePort oder ein ServiceWorker-Objekt sein kann), die den Nachrichtensender repräsentiert.

MessageEvent.ports Nur lesbar

Ein Array von MessagePort-Objekten, die die mit dem Kanal assoziierten Ports darstellen, über die die Nachricht gesendet wird (wo zutreffend, z. B. bei der Kanalnachrichtenübermittlung oder beim Senden einer Nachricht an einen Shared Worker).

Dieses Beispiel zeigt eine Shared Worker-Datei – wenn eine Verbindung zum Worker von einem Hauptthread über einen MessagePort hergestellt wird, wird der onconnect-Event-Handler ausgelöst. Das Ereignisobjekt ist ein MessageEvent.

Der verbindende Port kann über den ports-Parameter des Ereignisobjekts referenziert werden; auf diese Referenz kann ein onmessage-Handler angewendet werden, um eingehende Nachrichten über den Port zu verarbeiten, und die Methode postMessage() kann verwendet werden, um Nachrichten über den Worker zurück an den Hauptthread zu senden.

self.onconnect = (e) => {
  const port = e.ports[0];

  port.onmessage = (e) => {
    const workerResult = `Result: ${e.data[0] * e.data[1]}`;
    port.postMessage(workerResult);
  };

  port.start();
};

Für ein vollständiges laufendes Beispiel sehen Sie unser Einfaches Shared Worker-Beispiel (Shared Worker ausführen.)

Sie könnten auch einen Ereignishandler mit der Methode addEventListener() einrichten:

self.addEventListener("connect", (e) => {
  const port = e.ports[0];

  port.onmessage = (e) => {
    const workerResult = `Result: ${e.data[0] * e.data[1]}`;
    port.postMessage(workerResult);
  };
});

• Verwendung von Web Workern
• SharedWorkerGlobalScope