Location.hostname — Eigenschaft · JavaScript-Referenz

Signatur

Location.hostname

Beschreibung

Die Eigenschaft hostname des Location-Interfaces enthält den Domainnamen oder die IP-Adresse der aktuellen URL, zum Beispiel "www.example.com" oder "192.168.0.10". Anders als location.host enthält sie keinen Port. Auch Protokoll, Pfad, Query-String und Fragment fehlen.

Typische Einsatzfälle sind umgebungsabhängige Konfigurationen (Entwicklung auf localhost oder Produktion), das Erkennen von Subdomains (etwa Mandanten oder Sprachversionen) und das Bauen von API-URLs relativ zum aktuellen Host.

Die Eigenschaft ist beschreibbar. Wenn du ihr einen neuen Wert zuweist, navigiert der Browser zur gleichen URL auf dem neuen Host. Protokoll, Port, Pfad, Query und Hash bleiben dabei erhalten. Die Navigation erzeugt einen neuen Eintrag im Verlauf.

IPv6-Adressen werden in eckigen Klammern zurückgegeben, z. B. "[::1]". Internationalisierte Domainnamen (IDN) erscheinen in der Punycode-Form, z. B. "xn--mnchen-3ya.de" für münchen.de.

Parameter

Name	Typ	Default	Beschreibung
$value	string		Nur beim Setzen: der neue Hostname. Die Zuweisung löst eine Navigation zur URL mit diesem Host aus.

Rückgabewert

Typ

string

Beschreibung

Der Hostname der aktuellen URL ohne Port, z. B. "www.example.com". Bei URLs ohne Host (z. B. file: oder about:blank) ist es ein leerer String "".

Beispiele

Hostname auslesen und von host unterscheiden

// Angenommen, die Seite läuft unter https://shop.example.com:8443/produkte?id=42
console.log(location.hostname);
console.log(location.host);
console.log(location.origin);

shop.example.com shop.example.com:8443 https://shop.example.com:8443

Umgebung erkennen und API-Basis wählen

const isLocal = ['localhost', '127.0.0.1', '[::1]'].includes(location.hostname);

const apiBase = isLocal
  ? 'http://localhost:3000/api'
  : `https://api.${location.hostname.replace(/^www\./, '')}`;

console.log(apiBase);

// auf https://www.example.com: https://api.example.com

Subdomain als Mandant auslesen

const getTenant = (hostname = location.hostname) => {
  const parts = hostname.split('.');
  // mandant.app.example.com -> "mandant"
  return parts.length > 3 ? parts[0] : null;
};

console.log(getTenant('acme.app.example.com'));
console.log(getTenant('app.example.com'));

acme null

Hostname setzen (Weiterleitung auf anderen Host)

// Von http://example.com/login auf http://www.example.com/login umleiten
if (location.hostname === 'example.com') {
  location.hostname = 'www.example.com'; // Pfad, Query und Hash bleiben erhalten
}

// Wichtig · Fallstricke

Nicht mit host verwechseln: host enthält den Port (example.com:8080), hostname nicht. Wenn du Origins vergleichst, nutze besser location.origin. Dort sind Protokoll und Port enthalten.
Keine Sicherheitsprüfung: Ein Check wie hostname.endsWith('example.com') passt auch auf evil-example.com. Prüfe deshalb exakt oder mit führendem Punkt (=== 'example.com' || endsWith('.example.com')).
Der Wert ist in Kleinbuchstaben normalisiert. IDNs werden als Punycode geliefert, IPv6-Adressen mit eckigen Klammern.
Bei file:-URLs, about:blank und data:-URLs ist der Wert meist ein leerer String.
Wenn du hostname setzt, löst das sofort eine Navigation aus. Ungültige Werte werden ignoriert oder lösen je nach Browser einen Fehler aus. Für Weiterleitungen ist location.replace() oft die bessere Wahl, weil kein Eintrag im Verlauf entsteht.
In Web Workern gibt es WorkerLocation.hostname, dort nur lesbar. Für beliebige URLs nimmst du new URL(str).hostname.
Die Eigenschaft wird von allen Browsern unterstützt.

Siehe auch

Location Location.host Location.origin Location.port Location.href URL.hostname Location.replace()