Come estrarre la parte del nome host di un URL in JavaScript

Esiste un modo davvero semplice per iniziare da un URL completo:

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

Ed estrai solo la parte host:

aaa.bbb.ccc.com

Deve esserci una funzione JavaScript che lo fa in modo affidabile, ma non riesco a trovarlo.

supponiamo di avere una pagina con questo indirizzo: http://sub.domain.com/virtualPath/page.htm. utilizzare quanto segue nel codice della pagina per ottenere questi risultati:

• window.location.host: otterrai sub.domain.com:8080osub.domain.com:80
• window.location.hostname : otterrai sub.domain.com
• window.location.protocol : otterrai http:
• window.location.port: otterrai 8080o80
• window.location.pathname : otterrai /virtualPath
• window.location.origin: otterrai http://sub.domain.com*****

Aggiornamento: sull'originale

***** Come indicato da ref , la compatibilità del browser per window.location.originnon è chiara. L'ho controllato in Chrome e ha restituito http://sub.domain.com:portse la porta è tutt'altro che 80 e http://sub.domain.comse la porta è 80.

Un ringraziamento speciale a @torazaburo per avermelo detto.

È possibile concatenare il protocollo di posizione e l'host:

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

Per un url, diciamo 'http://stackoverflow.com/questions', tornerà'http://stackoverflow.com'

Usa l' document.locationoggetto e le sue hosto hostnameproprietà.

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

La risposta accettata non ha funzionato per me poiché voleva essere in grado di funzionare con qualsiasi URL arbitrario, non solo con l'URL della pagina corrente.

Dai un'occhiata URLall'oggetto :

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"

Ci sono due modi. La prima è una variante di un'altra risposta qui, ma questa rappresenta le porte non predefinite:

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

Ma preferisco questo metodo più semplice (che funziona con qualsiasi stringa URI):

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

uso

window.location.origin

e per: " http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah "

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

Provare

document.location.host

o

document.location.hostname

C'è un altro trucco che uso e che non ho mai visto in nessuna risposta StackOverflow: l'uso dell'attributo "src" di un'immagine produrrà il percorso di base completo del tuo sito. Per esempio :

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

Su un URL come http://domain.com/somesite/index.html, rootverrà impostato su http://domain.com/somesite/. Questo funziona anche per localhost o qualsiasi URL di base valido.

Si noti che ciò causerà una richiesta HTTP non riuscita sul $ sull'immagine fittizia. Puoi invece utilizzare un'immagine esistente per evitarlo, con solo lievi modifiche al codice.

Un'altra variante utilizza un collegamento fittizio, senza effetti collaterali sulle richieste HTTP:

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

Tuttavia, non l'ho provato su tutti i browser.

Verificare questo:

alert(window.location.hostname);

questo restituirà il nome host come www.domain.com

e:

window.location.host

restituirà il nome di dominio con porta come www.example.com:80

Per un riferimento completo, consultare il sito degli sviluppatori Mozilla .

Vorrei specificare qualcosa. Se qualcuno vuole ottenere l'intero URL con il percorso di cui ho bisogno, può usare:

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

So che è un po 'tardi, ma ho fatto una piccola funzione pulita con una piccola sintassi ES6

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

Potrebbe anche essere scritto in ES5 come

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

Naturalmente IE non supporta Object.assign, ma nella mia linea di lavoro, non importa.

Regex offre molta più flessibilità.

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