So extrahieren Sie den Hostnamen-Teil einer URL in JavaScript

Gibt es eine wirklich einfache Möglichkeit, von einer vollständigen URL aus zu beginnen:

document.location.href = "http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah"

Und extrahieren Sie nur den Host-Teil:

aaa.bbb.ccc.com

Es muss eine JavaScript-Funktion geben, die dies zuverlässig erledigt, aber ich kann sie nicht finden.

Angenommen, Sie haben eine Seite mit dieser Adresse : http://sub.domain.com/virtualPath/page.htm. Verwenden Sie den folgenden Seitencode, um diese Ergebnisse zu erzielen:

• window.location.host: du wirst sub.domain.com:8080oder bekommensub.domain.com:80
• window.location.hostname : Du wirst kriegen sub.domain.com
• window.location.protocol : Du wirst kriegen http:
• window.location.port: du wirst 8080oder bekommen80
• window.location.pathname : Du wirst kriegen /virtualPath
• window.location.origin: du wirst http://sub.domain.com***** bekommen

Update: über die .origin

***** Wie in der Referenz angegeben , ist die Browserkompatibilität für window.location.originnicht klar. Ich habe es in Chrom überprüft und es wurde zurückgegeben, http://sub.domain.com:portwenn der Port alles andere als 80 ist und http://sub.domain.comwenn der Port 80 ist.

Besonderer Dank geht an @torazaburo für die Erwähnung.

Sie können das Standortprotokoll und den Host verketten:

var root = location.protocol + '//' + location.host;

Angenommen, eine URL 'http://stackoverflow.com/questions'wird zurückgegeben'http://stackoverflow.com'

Verwenden Sie das document.locationObjekt und seine hostoder hostnameEigenschaften.

alert(document.location.hostname); // alerts "stackoverflow.com"

Die akzeptierte Antwort hat bei mir nicht funktioniert, da ich mit beliebigen willkürlichen URLs arbeiten wollte, nicht nur mit der aktuellen Seiten-URL.

Schauen Sie sich das URLObjekt an :

var url = new URL("http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah");
url.protocol;  // "http:"
url.hostname;  // "aaa.bbb.ccc.com"
url.pathname;  // "/asdf/asdf/sadf.aspx"
url.search;    // "?blah"

Es gibt zwei Möglichkeiten. Die erste ist eine Variante einer anderen Antwort hier, aber diese berücksichtigt nicht standardmäßige Ports:

function getRootUrl() {
  var defaultPorts = {"http:":80,"https:":443};

  return window.location.protocol + "//" + window.location.hostname
   + (((window.location.port)
    && (window.location.port != defaultPorts[window.location.protocol]))
    ? (":"+window.location.port) : "");
}

Aber ich bevorzuge diese einfachere Methode (die mit jeder URI-Zeichenfolge funktioniert):

function getRootUrl(url) {
  return url.toString().replace(/^(.*\/\/[^\/?#]*).*$/,"$1");
}

verwenden

window.location.origin

und für: " http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah "

Sie erhalten: http://aaa.bbb.ccc.ddd.com/

Versuchen

document.location.host

oder

document.location.hostname

Es gibt einen anderen Hack, den ich verwende und der in keiner StackOverflow-Antwort gesehen wurde: Wenn Sie das Attribut "src" eines Bildes verwenden, erhalten Sie den vollständigen Basispfad Ihrer Site. Zum Beispiel :

var dummy = new Image;
dummy.src = '$';                  // using '' will fail on some browsers
var root = dummy.src.slice(0,-1); // remove trailing '$'

Auf einer URL wie http://domain.com/somesite/index.html, rootwird festgelegt werden http://domain.com/somesite/. Dies funktioniert auch für localhost oder eine gültige Basis-URL.

Beachten Sie, dass dies eine fehlgeschlagene HTTP-Anforderung auf dem Computer verursacht $ Dummy-Image verursacht. Sie können stattdessen ein vorhandenes Bild verwenden, um dies mit nur geringfügigen Codeänderungen zu vermeiden.

Eine andere Variante verwendet einen Dummy-Link ohne Nebenwirkungen auf HTTP-Anforderungen:

var dummy = document.createElement ('a');
dummy.href = '';
var root = dummy.href;

Ich habe es jedoch nicht in jedem Browser getestet.

Überprüfen Sie dies:

alert(window.location.hostname);

Dies gibt den Hostnamen als zurück www.domain.com

und:

window.location.host

gibt den Domainnamen mit dem Port like zurück www.example.com:80

Eine vollständige Referenz finden Sie auf der Mozilla-Entwicklerseite .

Ich möchte etwas spezifizieren. Wenn jemand die gesamte URL mit dem von mir benötigten Pfad erhalten möchte, kann er Folgendes verwenden:

var fullUrl = window.location.protocol + "//" + window.location.hostname + window.location.pathname;

Ich weiß, dass dies etwas spät ist, aber ich habe eine saubere kleine Funktion mit einer kleinen ES6-Syntax erstellt

function getHost(href){
  return Object.assign(document.createElement('a'), { href }).host;
}

Es könnte auch in ES5 wie geschrieben werden

function getHost(href){
  return Object.assign(document.createElement('a'), { href: href }).host;
}

Natürlich unterstützt IE nicht Object.assign, aber in meiner Arbeit spielt das keine Rolle.

Regex bietet viel mehr Flexibilität.

    //document.location.href = "http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah
    //1.
     var r = new RegExp(/http:\/\/[^/]+/);
     var match = r.exec(document.location.href) //gives http://aaa.bbb.ccc.com

    //2. 
     var r = new RegExp(/http:\/\/[^/]+\/[^/]+/);
     var match = r.exec(document.location.href) //gives http://aaa.bbb.ccc.com/asdf