Start · Sprachen · JavaScript · Referenz · Window.opener

Window.opener

Eigenschaft

Liefert eine Referenz auf das Fenster, das das aktuelle Fenster per <code>window.open()</code> oder über einen Link mit <code>target</code> geöffnet hat, sonst <code>null</code>.

seit JavaScript Baseline: alle Browser Kategorie: webapi

Signatur

Window.opener

Beschreibung

window.opener verweist auf das Window-Objekt, das das aktuelle Fenster bzw. den aktuellen Tab geöffnet hat. Das passiert entweder über window.open() oder über einen Link bzw. ein Formular mit target="_blank" (oder einem benannten Ziel). Wurde das Fenster direkt vom Nutzer geöffnet, etwa über die Adresszeile oder ein Lesezeichen, ist der Wert null.

Typische Einsatzfälle sind Pop-up-Abläufe wie OAuth- oder Zahlungsdialoge. Das Pop-up meldet dabei sein Ergebnis an das öffnende Fenster zurück, am besten per opener.postMessage(), und schließt sich anschließend selbst. Stammen beide Fenster vom gleichen Ursprung (same origin), kann das Pop-up auch direkt auf DOM und Funktionen des Öffners zugreifen.

Bei unterschiedlichen Ursprüngen bekommt man nur einen eingeschränkten WindowProxy. Erlaubt sind dann nur wenige Operationen wie postMessage(), close(), closed, focus(), blur() und das Setzen von location. Gerade Letzteres macht opener sicherheitsrelevant (siehe Hinweise).

Die Eigenschaft lässt sich beschreiben. Mit window.opener = null trennt eine Seite die Verbindung zu ihrem Öffner.

Rückgabewert

Typ
Window | WindowProxy | null
Beschreibung
Das öffnende Fenster. Bei fremdem Ursprung ist es ein eingeschränkter WindowProxy. null kommt zurück, wenn es keinen Öffner gibt oder die Verbindung durch noopener, rel="noreferrer" oder eine COOP-Richtlinie getrennt wurde.

Beispiele

Prüfen, ob die Seite geöffnet wurde

if (window.opener) {
  console.log('Dieses Fenster wurde von einer anderen Seite geöffnet.');
} else {
  console.log('Kein Öffner vorhanden.');
}
Kein Öffner vorhanden.

OAuth-Pop-up meldet Ergebnis per postMessage

// Im Pop-up (z. B. /auth/callback), gleicher oder fremder Ursprung
const params = new URLSearchParams(location.search);
const code = params.get('code');

if (window.opener && !window.opener.closed) {
  // Ziel-Ursprung immer explizit angeben!
  window.opener.postMessage({ type: 'oauth', code }, 'https://app.example.com');
  window.close();
}

// Im Hauptfenster
const popup = window.open('/auth/start', 'auth', 'width=500,height=600');
window.addEventListener('message', (event) => {
  if (event.origin !== 'https://app.example.com') return;
  if (event.data?.type === 'oauth') {
    console.log('Auth-Code erhalten:', event.data.code);
  }
});
Auth-Code erhalten: abc123

Direkter Zugriff bei gleichem Ursprung

// Im Pop-up, gleicher Ursprung wie der Öffner
const opener = window.opener;
if (opener) {
  opener.document.querySelector('#status').textContent = 'Auswahl übernommen';
  opener.focus();
}

Verbindung zum Öffner kappen

// Variante 1: beim Öffnen
const win = window.open('https://extern.example.org', '_blank', 'noopener');
console.log(win); // mit noopener liefert open() null

// Variante 2: in der geöffneten Seite selbst
window.opener = null;
console.log(window.opener);
null null

// Wichtig · Fallstricke

  • Reverse Tabnabbing: Eine fremde Seite, die über target="_blank" geöffnet wurde, kann mit window.opener.location = 'https://phishing.example' die ursprüngliche Seite unbemerkt auf eine Phishing-Seite umleiten. Deshalb bei externen Links rel="noopener" (oder noreferrer) setzen bzw. bei window.open() das Feature noopener angeben.
  • Aktuelle Browser (Chrome 88+, Firefox 79+, Safari 12.1+) behandeln <a target="_blank"> ohne rel-Angabe automatisch wie rel="noopener". Dort ist opener dann null. Wer den Öffner braucht, muss rel="opener" explizit setzen. Für window.open() gilt diese Voreinstellung nicht.
  • Der HTTP-Header Cross-Origin-Opener-Policy: same-origin trennt die Verbindung zu Fenstern fremden Ursprungs ebenfalls. opener ist dann null. Das kann OAuth-Pop-ups kaputt machen, deshalb gegebenenfalls same-origin-allow-popups verwenden.
  • Bei fremdem Ursprung wirft jeder Zugriff auf opener.document oder auf eigene Funktionen des Öffners einen SecurityError. Die Kommunikation läuft dann über postMessage(). Dabei immer einen konkreten targetOrigin statt '*' angeben und beim Empfänger event.origin prüfen.
  • Der Öffner kann inzwischen geschlossen oder weggeleitet worden sein. Vor der Nutzung opener.closed prüfen.