Comment extraire la partie du nom d'hôte d'une URL en JavaScript

Existe-t-il un moyen très simple de démarrer à partir d'une URL complète:

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

Et extrayez juste la partie hôte:

aaa.bbb.ccc.com

Il doit y avoir une fonction JavaScript qui le fait de manière fiable, mais je ne la trouve pas.

supposons que vous avez une page avec cette adresse: http://sub.domain.com/virtualPath/page.htm. utilisez le code de page suivant pour obtenir ces résultats:

• window.location.host: vous obtiendrez sub.domain.com:8080ousub.domain.com:80
• window.location.hostname : tu auras sub.domain.com
• window.location.protocol : tu auras http:
• window.location.port: vous obtiendrez 8080ou80
• window.location.pathname : tu auras /virtualPath
• window.location.origin: vous obtiendrez http://sub.domain.com*****

Mise à jour: à propos du .origin

***** Comme l'indique la référence , la compatibilité du navigateur pour window.location.originn'est pas claire. Je l'ai vérifié en chrome et il est revenu http://sub.domain.com:portsi le port est autre que 80 et http://sub.domain.comsi le port est 80.

Un merci spécial à @torazaburo pour me l'avoir mentionné.

Vous pouvez concaténer le protocole de localisation et l'hôte:

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

Pour une URL, disons 'http://stackoverflow.com/questions', elle reviendra'http://stackoverflow.com'

Utilisez l' document.locationobjet et ses propriétés hostou hostname.

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

La réponse acceptée n'a pas fonctionné pour moi car je voulais pouvoir travailler avec n'importe quelle URL arbitraire, pas seulement avec l'URL de la page actuelle.

Jetez un œil à l' URLobjet :

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"

Il y a deux façons. La première est une variante d'une autre réponse ici, mais celle-ci représente les ports non par défaut:

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

Mais je préfère cette méthode plus simple (qui fonctionne avec n'importe quelle chaîne URI):

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

utilisation

window.location.origin

et pour: " http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah "

vous obtiendrez: http://aaa.bbb.ccc.ddd.com/

Essayer

document.location.host

ou

document.location.hostname

Il y a un autre hack que j'utilise et que je n'ai jamais vu dans aucune réponse StackOverflow: l'utilisation de l'attribut "src" d'une image donnera le chemin de base complet de votre site. Par exemple :

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

Sur une URL comme http://domain.com/somesite/index.html, rootsera défini sur http://domain.com/somesite/. Cela fonctionne également pour localhost ou toute URL de base valide.

Notez que cela entraînera l'échec d'une demande HTTP sur l' $image factice. Vous pouvez utiliser une image existante à la place pour éviter cela, avec seulement de légères modifications de code.

Une autre variante utilise un lien factice, sans effet secondaire sur les requêtes HTTP:

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

Cependant, je ne l'ai pas testé sur tous les navigateurs.

Vérifiez ça:

alert(window.location.hostname);

cela renverra le nom d'hôte comme www.domain.com

et:

window.location.host

renverra le nom de domaine avec le port comme www.example.com:80

Pour une référence complète, consultez le site du développeur Mozilla .

Je voudrais préciser quelque chose. Si quelqu'un veut obtenir l'URL complète avec le chemin dont j'ai besoin, peut utiliser:

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

Je sais que c'est un peu tard, mais j'ai fait une petite fonction propre avec un peu de syntaxe ES6

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

Il pourrait également être écrit dans ES5 comme

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

Bien sûr, IE ne prend pas en charge Object.assign, mais dans mon domaine de travail, cela n'a pas d'importance.

Regex offre beaucoup plus de flexibilité.

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