Um eine Verlinkung automatisch in einem neuen Tab zu öffnen, wird das Attribut target benötigt. Setzt ihr deren Wert auf _blank, so öffnet sich die URL in einem neuen Tab. Doch das kann für den Nutzer schnell zur Gefahr werden.

Wird ein Link geöffnet, so hat die neue Webseite nicht nur lesbaren Zugriff auf die ursprüngliche Seite. Sie kann die Informationen sogar verändern. Dabei muss differenziert werden: Eine Verlinkung kann intern und extern zwischen komplett verschiedenen Domains stattfinden. Innerhalb einer Domain hat die Zielseite vollen Zugriff auf window.opener. Das Objekt repräsentiert eine Referenz auf das Fenster, von dem aus der Link geöffnet wurde. Das gibt der Zielseite die Möglichkeit auf alle zugehörigen Window-Eigenschaften zuzugreifen. Habt ihr alleinigen Zugriff auf eure Domain, dürfte das erstmal kein weiteres Risiko darstellen.

Gefährlich wird es erst dann, wenn ihr extern auf eine komplett andere Domain verlinkt. Das Zieldokument hat zwar keinen vollständigen Zugriff mehr auf das Opener-Window-Objekt, jedoch weiterhin auf Teile davon. Konkret gehört opener.location dazu. Das Location-Objekt ermöglicht den vollständigen Zugriff auf die URI des Opener. Sie kann nicht nur abgefragt, sondern auch verändert werden. Wird die URI geändert, führt der Web-Browser die auch direkt aus.

Durch den Zugriff auf das Location-Objekt kann ein möglicher Angreifer die ursprüngliche Seite zu einer ganz anderen ändern. Das tückische daran: Der Benutzer bekommt es nicht mit, da er sich ja in einem neuen Tab befindet. So könnte sich in dem vorherigen Tab beispielsweise eine Phishing-Seite öffnen, die die originale Website nachahmt und Login- oder andere sicherheitsrelevante Daten abfragt. Da sich aber kein Pop-up oder anderer Tab geöffnet hat, wird der Benutzer nicht so schnell misstrauisch: Welcher Nutzer schaut sich erneut die genaue URL eines bereits geöffneten Tabs an? Er denkt zu wissen, was er dort genau geöffnet hat. Das ist nur ein Beispiel, wie ein potentieller Angreifer eine solche Situation ausnutzen könnte. Um die Sicherheitslücke zu schließen, müsste bei der Verlinkung auf ein weiteres Attribut zurückgegriffen werden.

Um beim Öffnen eines Links das Opener-Objekt nicht weiterzugeben und auf Null zu setzen, sollte das weitere Attribut rel auf noopener gesetzt werden. Das unterbindet den kompletten Zugriff auf das ursprüngliche Window-Objekt. Ein genauerer Blick auf den Browser-Support dieser Lösung offenbart jedoch ein Problem: Der Internet Explorer, Edge sowie einige seltener verwendeten Browser und Versionen unterstützen noopener nicht.

Aus dem Grund sollte außerdem noreferrer ergänzt werden, was den Referrer-HTTP-Header deaktiviert. So wird die ursprüngliche URL nicht mehr mitgeschickt. Das schließt die Sicherheitslücke jedoch nicht vollständig. Alternativ kann folgender JavaScript-Code zum Öffnen externer Links verwendet werden, um den Opener auch bei älteren Web-Browsern nicht zu übergeben. Hier sollte aber bedacht werden, dass die Variante den Pop-up-Blocker des Web-Browsers auf den Plan rufen kann.

function openURL(url) {
  var newTab = window.open();
  newTab.opener = null;
  newTab.location = url;
}

Insgesamt sollte der HTML-Code für das Öffnen eines Links in einem neuen Tab beziehungsweise neuem Fenster wie folgt aussehen:

<a href="https://example.de" target="_blank" rel="noopener noreferrer">Öffne Website im neuen Tab</a>

Das automatische Öffnen von externen Links im neuen Tab ist abgesehen von den Sicherheitsrisiken keine ganz unumstrittene Methode. Denn damit wird dem Nutzer die Entscheidung abgenommen, ob er den Link im aktuellen oder in einem neuen Tab öffnen möchte. Deswegen und aufgrund der Phishing-Gefahr sollte darauf im Idealfall komplett verzichtet werden. Möchtet ihr dennoch auf diese Weise verlinken, so sollten immer die obigen HTML-Attribute eingefügt werden, um auf der sicheren Seite zu sein. Nichtsdestotrotz sollte vollständig darauf verzichtet werden, nutzergenerierte Links automatisch in einem neuen Tab zu öffnen.

Lies auch weitere spannende Artikel mit dem Thema Webentwicklung. Bist du Anfänger? Dann helfen dir diese Youtube-Kanäle beim Einstieg