Start · Sprachen · JavaScript · Referenz · Window.origin

Window.origin

Eigenschaft

Gibt den Ursprung (Origin) des aktuellen globalen Kontexts als serialisierte Zeichenkette zurück, z. B. <code>"https://example.com"</code> oder <code>"null"</code>.

seit JavaScript Baseline: alle modernen Browser (Chrome 59+, Firef Kategorie: webapi

Signatur

Window.origin

Beschreibung

Die schreibgeschützte Eigenschaft window.origin (global auch einfach als origin erreichbar) liefert den Ursprung des globalen Kontexts als Zeichenkette. Ein Ursprung besteht aus Schema, Host und Port, z. B. "https://shop.example.com:8443". Der Standardport des Schemas (443 bei HTTPS, 80 bei HTTP) wird dabei weggelassen.

Anders als location.origin, das nur die URL des Dokuments auswertet, gibt window.origin den tatsächlichen Sicherheitsursprung zurück. Das ist wichtig bei Sandbox-iframes (<iframe sandbox> ohne allow-same-origin), data:-URLs oder Dokumenten mit CSP-Direktive sandbox: Dort ist der Ursprung opak, und window.origin liefert "null", während location.origin womöglich noch die ursprüngliche Adresse anzeigt.

Typische Einsatzgebiete sind Sicherheitsprüfungen beim Nachrichtenaustausch mit postMessage(), das Bilden absoluter URLs für die gleiche Herkunft und das Protokollieren bzw. Diagnostizieren von Kontexten (z. B. in Workern über self.origin, das über WindowOrWorkerGlobalScope ebenfalls verfügbar ist).

Rückgabewert

Typ
string
Beschreibung
Der serialisierte Ursprung, z. B. "https://example.com". Bei opaken Ursprüngen (Sandbox, data:-URL, teils file:) die Zeichenkette "null" — nicht der Wert null.

Beispiele

Aktuellen Ursprung auslesen

// Auf https://www.example.com:443/pfad/seite.html?x=1
console.log(window.origin);
console.log(origin === window.origin); // globaler Kurzzugriff
https://www.example.com true

Nachrichten nur vom eigenen Ursprung akzeptieren

window.addEventListener('message', (event) => {
  // Nur Nachrichten aus demselben Ursprung verarbeiten
  if (event.origin !== window.origin) {
    console.warn('Nachricht von fremdem Ursprung verworfen:', event.origin);
    return;
  }
  console.log('Vertrauenswürdige Nachricht:', event.data);
});

// Gezielt an ein gleich-ursprüngliches Fenster senden
const popup = window.open('/hilfe.html');
popup?.postMessage({ typ: 'init' }, window.origin);

Opaken Ursprung in einer Sandbox erkennen

const istOpak = window.origin === 'null';

if (istOpak) {
  console.log('Sandbox-Kontext: kein Zugriff auf Cookies/Storage erwarten.');
} else {
  console.log(`Normaler Kontext: ${window.origin}`);
  console.log('location.origin:', location.origin);
}
Normaler Kontext: https://www.example.com location.origin: https://www.example.com

Absolute API-URL für den gleichen Ursprung bauen

const apiUrl = new URL('/api/benutzer', window.origin);

const ladeBenutzer = async () => {
  const res = await fetch(apiUrl);
  return res.json();
};

console.log(apiUrl.href);
https://www.example.com/api/benutzer

// Wichtig · Fallstricke

  • Zeichenkette "null": Bei opaken Ursprüngen wird der String "null" zurückgegeben. Prüfungen wie if (!window.origin) greifen daher nicht — explizit mit === 'null' vergleichen.
  • Sicherheit bei postMessage: Niemals event.origin === 'null' als vertrauenswürdig akzeptieren – alle Sandbox-iframes und data:-Dokumente teilen sich diesen Wert. Außerdem beim Senden nie '*' als Ziel-Ursprung verwenden, wenn sensible Daten übertragen werden.
  • Unterschied zu location.origin: location.origin leitet sich aus der URL ab, window.origin spiegelt den echten Sicherheitsursprung. Für Sicherheitsentscheidungen ist window.origin die richtige Wahl.
  • Überschreibbar: Die Eigenschaft ist als [Replaceable] definiert; eine Zuweisung window.origin = 'x' ersetzt sie im Skript still durch einen eigenen Wert. Globale Variablen namens origin können sie daher verdecken.
  • Kompatibilität: In allen modernen Browsern verfügbar, nicht im Internet Explorer. In Workern über self.origin nutzbar. file:-URLs liefern je nach Browser "null" oder "file://".