SharedWorkerGlobalScope: connect-Ereignis

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Das connect-Ereignis wird in geteilten Workern in ihrem SharedWorkerGlobalScope ausgelöst, wenn ein neuer Client verbindet.

Dieses Ereignis ist nicht abbrechbar und breitet sich nicht aus.

Syntax

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

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

onconnect = (event) => { }

Ereignis-Eigenschaften

Diese Schnittstelle erbt auch Eigenschaften von ihrem Elternteil, Event.

MessageEvent.data Schreibgeschützt: Die vom Nachrichtenemitter gesendeten Daten.
MessageEvent.origin Schreibgeschützt: Ein String, der den Ursprung des Nachrichtenemitters darstellt.
MessageEvent.lastEventId Schreibgeschützt: Ein String, der eine eindeutige ID für das Ereignis darstellt.
MessageEvent.source Schreibgeschützt: Eine MessageEventSource (die ein WindowProxy, MessagePort oder ServiceWorker-Objekt sein kann) repräsentiert den Nachrichtenemitter.
MessageEvent.ports Schreibgeschützt: Ein Array von MessagePort-Objekten, die die Ports darstellen, die mit dem Kanal assoziiert sind, über den die Nachricht gesendet wird (wo dies angemessen ist, z. B. im Kanal-Messaging oder beim Senden einer Nachricht an einen geteilten Worker).

Dieses Beispiel zeigt eine Datei eines geteilten Workers – wenn eine Verbindung zum Worker von einem Hauptthread über einen MessagePort erfolgt, wird der onconnect-Ereignishandler ausgelöst. Das Ereignisobjekt ist ein MessageEvent.

Der verbindende Port kann über den ports-Parameter des Ereignisobjekts referenziert werden; an diese Referenz kann ein onmessage-Handler angehängt werden, um eingehende Nachrichten über den Port zu verarbeiten, und die postMessage()-Methode kann verwendet werden, um Nachrichten zurück an den Hauptthread unter Verwendung des Workers 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 komplettes laufendes Beispiel, siehe unser Einfaches Shared-Worker-Beispiel (geteilten Worker ausführen.)

Äquivalent zu addEventListener

Sie könnten auch einen Ereignishandler mithilfe der addEventListener()-Methode 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);
  };
});