Jak wyodrębnić część nazwy hosta z adresu URL w JavaScript

Czy istnieje naprawdę łatwy sposób na rozpoczęcie od pełnego adresu URL:

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

I wyodrębnij tylko część hosta:

aaa.bbb.ccc.com

Musi istnieć funkcja JavaScript, która robi to niezawodnie, ale nie mogę jej znaleźć.

Przypuszczam, że masz stronę z adresem: http://sub.domain.com/virtualPath/page.htm. użyj następującego kodu strony, aby uzyskać te wyniki:

• window.location.host: dostaniesz sub.domain.com:8080lubsub.domain.com:80
• window.location.hostname : dostaniesz sub.domain.com
• window.location.protocol : dostaniesz http:
• window.location.port: dostaniesz 8080lub80
• window.location.pathname : dostaniesz /virtualPath
• window.location.origin: dostaniesz http://sub.domain.com*****

Aktualizacja: o .origin

***** Jak wskazuje odnośnik , zgodność przeglądarki dla window.location.originnie jest jasna. Sprawdziłem to w chrome i zwróciło, http://sub.domain.com:portjeśli port ma wartość inną niż 80, a http://sub.domain.comjeśli port to 80.

Specjalne podziękowania dla @torazaburo za to, że mi o tym wspomniał.

Możesz połączyć protokół lokalizacji i hosta:

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

W przypadku adresu URL, powiedzmy 'http://stackoverflow.com/questions', wróci'http://stackoverflow.com'

Zastosowanie document.locationprzedmiotu i jego hostOR hostnamewłaściwości.

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

Przyjęta odpowiedź nie działała dla mnie, ponieważ chciałem móc pracować z dowolnym dowolnym adresem URL, a nie tylko bieżącym adresem URL strony.

Spójrz na URLobiekt :

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"

Istnieją dwa sposoby. Pierwsza jest wariantem innej odpowiedzi tutaj, ale ta odpowiada na porty inne niż domyślne:

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) : "");
}

Ale wolę tę prostszą metodę (która działa z dowolnym ciągiem URI):

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

posługiwać się

window.location.origin

i dla: „ http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah ”

dostaniesz: http://aaa.bbb.ccc.ddd.com/

Próbować

document.location.host

lub

document.location.hostname

Jest inny hack, którego używam i nigdy nie widziałem w żadnej odpowiedzi StackOverflow: użycie atrybutu „src” obrazu da pełną ścieżkę bazową witryny. Na przykład :

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

Na zasadzie jak adres URL http://domain.com/somesite/index.html, rootzostanie ustawiony http://domain.com/somesite/. Działa to również dla localhost lub dowolnego poprawnego podstawowego adresu URL.

Pamiętaj, że spowoduje to nieudane żądanie HTTP dla $obrazu zastępczego. Aby tego uniknąć, możesz użyć istniejącego obrazu, z niewielkimi zmianami kodu.

Inny wariant wykorzystuje fałszywy link, bez skutków ubocznych na żądania HTTP:

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

Nie przetestowałem tego jednak w każdej przeglądarce.

Sprawdź to:

alert(window.location.hostname);

zwróci to nazwę hosta jako www.domain.com

i:

window.location.host

zwróci nazwę domeny z portem podobnym do www.example.com:80

Aby uzyskać pełne informacje, sprawdź witrynę programisty Mozilla .

Chciałbym coś sprecyzować. Jeśli ktoś chce uzyskać cały adres URL ze ścieżką, której potrzebuję, może użyć:

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

Wiem, że to trochę za późno, ale zrobiłem czystą małą funkcję z małą składnią ES6

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

Może być również napisany w ES5 jak

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

Oczywiście IE nie obsługuje Object.assign, ale w mojej branży to nie ma znaczenia.

Regex zapewnia znacznie większą elastyczność.

    //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