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

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', il sera de retour 'http://stackoverflow.com'

Utilisez l'objet document.location et ses propriétés host ou hostname.

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

Il y a deux façons. Le premier est une variante d'une autre réponse ici, mais celle-ci tient compte des 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 D'URI):

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

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

Jetez un oeil à la URL objet:

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"

Essayez

document.location.host

Ou

document.location.hostname

Utiliser

Fenêtre.emplacement.origine

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

, Vous obtiendrez: http://aaa.bbb.ccc.ddd.com/

Il y a un autre hack que j'utilise et que je n'ai jamais vu dans une 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, {[3] } sera 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 requête HTTP sur l'image fictive $. 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;

Je ne l'ai pas testé sur tous les navigateurs, cependant.

Vérifiez ceci:

alert(window.location.hostname);

Cela retourne 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 vérification complète des références Mozilla developer site.

Je voudrais préciser quelque chose. Si quelqu'un veut obtenir l'url entière avec le chemin comme 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 une petite 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 supporte pas Object.assign, mais dans mon travail, cela n'a pas d'importance.