URL.hostname — Eigenschaft · JavaScript-Referenz

Signatur

URL.hostname

Beschreibung

Die Eigenschaft hostname eines URL-Objekts enthält den Domain-Namen (z. B. www.example.com) oder die IP-Adresse (z. B. 192.168.0.1 oder [::1]) der URL. Anders als bei URL.host ist der Port nicht enthalten.

Man nutzt hostname vor allem, um Links zu prüfen (etwa ob ein Link intern oder extern ist), um Domain-Whitelists umzusetzen oder um eine URL gezielt auf einen anderen Server umzuschreiben. Die Eigenschaft ist lesbar und schreibbar: Beim Setzen bleiben Protokoll, Port, Pfad, Query und Fragment unverändert.

Der Wert wird vom Parser normalisiert: Domain-Namen werden in Kleinbuchstaben umgewandelt und internationalisierte Domain-Namen (IDN) in Punycode kodiert, z. B. wird münchen.de zu xn--mnchen-3ya.de. IPv6-Adressen erscheinen mit eckigen Klammern.

Parameter

Name	Typ	Default	Beschreibung
$value	string		Nur beim Setzen: der neue Hostname. Ungültige Werte werden stillschweigend ignoriert, die URL bleibt dann unverändert.

Rückgabewert

Typ

string

Beschreibung

Den normalisierten Hostnamen (Kleinbuchstaben, Punycode, IPv6 in [ ]) ohne Port. Bei URLs ohne Host, z. B. mailto: oder data:, eine leere Zeichenkette.

Beispiele

Hostname auslesen und von host unterscheiden

const url = new URL('https://WWW.Example.com:8080/pfad?q=1#top');
console.log(url.hostname);
console.log(url.host);

const ip6 = new URL('http://[::1]:3000/');
console.log(ip6.hostname);

const idn = new URL('https://münchen.de/');
console.log(idn.hostname);

www.example.com www.example.com:8080 [::1] xn--mnchen-3ya.de

Externe Links erkennen und markieren

const isExternal = (href, base = location.href) => {
  const url = new URL(href, base);
  return url.hostname !== location.hostname;
};

document.querySelectorAll('a[href]').forEach((a) => {
  if (isExternal(a.href)) {
    a.target = '_blank';
    a.rel = 'noopener noreferrer';
  }
});

Domain-Whitelist für Weiterleitungen (inkl. Subdomains)

const ALLOWED = ['example.com', 'cdn.example.net'];

const isAllowed = (raw) => {
  try {
    const { hostname, protocol } = new URL(raw);
    if (protocol !== 'https:') return false;
    return ALLOWED.some((d) => hostname === d || hostname.endsWith(`.${d}`));
  } catch {
    return false; // keine gültige URL
  }
};

console.log(isAllowed('https://shop.example.com/cart'));
console.log(isAllowed('https://example.com.evil.io/'));
console.log(isAllowed('https://badexample.com/'));

true false false

Hostname setzen, um auf einen anderen Server umzuleiten

const url = new URL('https://api.example.com:8443/v1/users?page=2');
url.hostname = 'staging.example.com';
console.log(url.href);

https://staging.example.com:8443/v1/users?page=2

// Wichtig · Fallstricke

Kein Port: hostname enthält nie den Port. Wer Host und Port zusammen braucht, nimmt URL.host. Für einen Vergleich des Ursprungs (Protokoll + Host + Port) ist URL.origin die sicherere Wahl.
Sicherheit: Domains nie mit includes() oder startsWith() prüfen, denn example.com.evil.io oder evilexample.com kämen sonst durch. Vergleichen Sie exakt oder mit endsWith('.' + domain).
Normalisierung: IDN-Domains erscheinen in Punycode. Vergleiche mit Unicode-Schreibweisen schlagen deshalb fehl, wenn beide Seiten nicht vorher durch new URL() normalisiert wurden.
Ein schließender Punkt (example.com.) bleibt erhalten und gilt als anderer Wert als example.com.
Beim Setzen eines ungültigen Werts wird kein Fehler geworfen, die Zuweisung wird einfach ignoriert. Bei URLs ohne Host (z. B. mailto:) hat die Zuweisung keine Wirkung.
Kompatibilität: wird von allen modernen Browsern und Node.js unterstützt, nicht aber vom Internet Explorer. Dieselbe Eigenschaft gibt es auch bei Location und HTMLAnchorElement.

Siehe auch

URL URL.host URL.port URL.origin URL.protocol URL.href Location.hostname