WorkerLocation — Schnittstelle · JavaScript-Referenz

Signatur

interface WorkerLocation

Beschreibung

WorkerLocation ist das Gegenstück zu window.location innerhalb eines Workers. Ein solches Objekt bekommt man über self.location (bzw. einfach location) im globalen Kontext eines DedicatedWorkerGlobalScope, SharedWorkerGlobalScope oder ServiceWorkerGlobalScope. Es beschreibt die bereits aufgelöste, absolute URL des Worker-Skripts.

Anders als Location ist WorkerLocation nur lesbar: Es gibt keine Methoden wie assign(), replace() oder reload(), und die Eigenschaften lassen sich nicht setzen. Ein Worker kann also nicht „weg navigieren“.

Verfügbare Eigenschaften (alle string, nur lesbar):

href – vollständige URL (auch über toString())
protocol, host, hostname, port, origin
pathname, search, hash

Typische Anwendungsfälle: Konfiguration über Query-Parameter an den Worker übergeben (new Worker("worker.js?mode=debug")), relative URLs für fetch() oder importScripts() gegen die Skript-URL auflösen und im Service Worker den eigenen Ursprung prüfen.

Rückgabewert

Typ

WorkerLocation

Beschreibung

Wird über self.location im Worker-Kontext bereitgestellt; kein eigener Konstruktor vorhanden.

Beispiele

Worker mit Query-Parametern konfigurieren

// main.js
const worker = new Worker("worker.js?mode=debug&batch=50");
worker.onmessage = (e) => console.log(e.data);

// worker.js
const params = new URLSearchParams(self.location.search);
const mode = params.get("mode");
const batch = Number(params.get("batch") ?? 10);
self.postMessage(`Modus: ${mode}, Batchgröße: ${batch}`);

Modus: debug, Batchgröße: 50

Alle Eigenschaften der Skript-URL ausgeben

// worker.js, geladen von https://example.com:8443/js/worker.js?v=2#x
const { href, origin, protocol, host, hostname, port, pathname, search, hash } = self.location;
console.log({ href, origin, protocol, host, hostname, port, pathname, search, hash });
console.log(String(self.location) === href);

{ href: 'https://example.com:8443/js/worker.js?v=2#x', origin: 'https://example.com:8443', protocol: 'https:', host: 'example.com:8443', hostname: 'example.com', port: '8443', pathname: '/js/worker.js', search: '?v=2', hash: '#x' } true

Relative Ressourcen gegen die Worker-URL auflösen

// worker.js unter /js/worker.js
const dataUrl = new URL("../data/config.json", self.location.href);

const loadConfig = async () => {
  const res = await fetch(dataUrl);
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return res.json();
};

loadConfig().then((cfg) => self.postMessage({ url: dataUrl.href, cfg }));

Service Worker: nur Anfragen des eigenen Ursprungs cachen

// sw.js
self.addEventListener("fetch", (event) => {
  const url = new URL(event.request.url);
  if (url.origin !== self.location.origin) return; // Fremde Ursprünge ignorieren
  event.respondWith(
    caches.match(event.request).then((hit) => hit ?? fetch(event.request))
  );
});

// Wichtig · Fallstricke

Nur lesbar: Zuweisungen wie self.location.href = "..." werden stillschweigend ignoriert (im Strict Mode gibt es einen TypeError). Methoden wie assign(), reload() oder replace() gibt es nicht.
Skript-URL, nicht Seiten-URL: location im Worker verweist auf das Worker-Skript, nicht auf das Dokument, das den Worker erzeugt hat. Die Seiten-URL musst du bei Bedarf per postMessage() übergeben.
Blob- und Data-URLs: Bei Workern aus URL.createObjectURL() ist href eine blob:-URL. Relative Pfade werden dann nicht wie erwartet aufgelöst. Bei data:-URLs ist origin "null" (opaker Ursprung).
Weiterleitungen: Wird das Worker-Skript weitergeleitet, spiegelt location die endgültige URL wider.
Sicherheit: Query-Parameter sind für jeden sichtbar, der die URL sieht (Logs, DevTools). Übergib darüber keine Geheimnisse wie Tokens, sondern nutze dafür postMessage().
Kompatibilität: Wird von allen modernen Browsern in Dedicated, Shared und Service Workern unterstützt. origin gibt es erst in etwas neueren Versionen (in allen aktuellen Browsern vorhanden).

Siehe auch

Worker Location Geolocation CaretPosition Notification