Start · Sprachen · JavaScript · Referenz · WorkerLocation.hostname

WorkerLocation.hostname

Eigenschaft

Gibt den Hostnamen (ohne Port) der URL zurück, von der das Worker-Skript geladen wurde – als schreibgeschützte Zeichenkette.

seit JavaScript Baseline: alle modernen Browser Kategorie: webapi

Signatur

WorkerLocation.hostname

Beschreibung

Die schreibgeschützte Eigenschaft hostname des WorkerLocation-Objekts liefert den Hostnamen der URL, unter der das Worker-Skript liegt, z. B. "example.com" oder "localhost". Anders als host enthält sie keinen Port.

Im Worker-Kontext (Dedicated Worker, Shared Worker, Service Worker) erreicht man das Objekt über self.location bzw. einfach location. Die Eigenschaft ist das Gegenstück zu Location.hostname im Fenster-Kontext, lässt sich aber nicht ändern: Ein Worker kann nicht per Zuweisung weiternavigieren.

Nützlich ist hostname vor allem, um im Worker umgebungsabhängige Logik umzusetzen, etwa API-Endpunkte je nach Entwicklungs- oder Produktivumgebung auszuwählen, Debug-Ausgaben nur auf localhost zu aktivieren oder in einem Service Worker Anfragen an den eigenen Host von fremden zu unterscheiden.

Rückgabewert

Typ
string
Beschreibung
Der Hostname der Worker-Skript-URL ohne Port und ohne Protokoll, z. B. "app.example.com". IPv6-Adressen werden in eckigen Klammern geliefert ("[::1]"). Bei URLs ohne Host (z. B. blob:-URLs mit opakem Ursprung) kann es eine leere Zeichenkette sein.

Beispiele

Hostnamen im Worker auslesen

// worker.js — geladen über https://app.example.com:8443/js/worker.js
console.log(self.location.hostname);
console.log(self.location.host);
app.example.com app.example.com:8443

API-Endpunkt je nach Umgebung wählen

// worker.js
const isDev = ['localhost', '127.0.0.1'].includes(location.hostname);
const API_BASE = isDev
  ? 'http://localhost:3000/api'
  : `https://api.${location.hostname}`;

self.addEventListener('message', async ({ data }) => {
  const res = await fetch(`${API_BASE}/items/${data.id}`);
  self.postMessage(await res.json());
});

Service Worker: nur eigene Anfragen cachen

// sw.js
self.addEventListener('fetch', (event) => {
  const url = new URL(event.request.url);
  // Fremde Hosts (CDNs, Analytics) unverändert durchlassen
  if (url.hostname !== self.location.hostname) return;

  event.respondWith(
    caches.match(event.request).then((cached) => cached ?? fetch(event.request))
  );
});

// Wichtig · Fallstricke

  • Kein Port: Wer Host und Port braucht, verwendet location.host; für einen vollständigen Ursprungsvergleich ist location.origin sicherer, da er auch Protokoll und Port berücksichtigt.
  • Schreibgeschützt: Eine Zuweisung wie location.hostname = "x" wird stillschweigend ignoriert (im Strict Mode ggf. TypeError) – anders als bei window.location.
  • Blob-/Data-Worker: Wird ein Worker aus einer blob:- oder data:-URL erzeugt, spiegelt hostname nicht unbedingt den Host der Seite wider (bei data: ist er leer). In diesem Fall die Basis-URL besser per postMessage übergeben.
  • Internationalisierte Domainnamen werden in Punycode geliefert (z. B. xn--mnchen-3ya.de).
  • Kompatibilität: Unterstützt in allen modernen Browsern sowie in Deno; in Node.js-worker_threads gibt es kein WorkerLocation.