comment obtenir l'URL de l'hôte en utilisant javascript à partir de la page actuelle


183

Étant donné que je suis sur la page suivante:

http://www.webmail.com/pages/home.aspx

Comment puis-je récupérer le nom d'hôte ( "http://www.webmail.com") avec JavaScript?


3
duplication possible de Get host name en JavaScript
T.Todua

Réponses:


319
var host = window.location.hostname;

ou éventuellement

var host = "http://"+window.location.hostname;

ou si vous aimez la concaténation

var protocol = location.protocol;
var slashes = protocol.concat("//");
var host = slashes.concat(window.location.hostname);

3
Peut-être ne le spécifiez pas http. Utilisez le protocole relatif. Peut-être plus approprié que le codage en dur.
Darth Egregious

33
Utilisez window.location.host au lieu de hostname, ou il échouera si le port n'est pas 80.
Stefan Steiger

1
@MattBrowne Lorsque vous travaillez avec quelque chose qui produira une chaîne, je dirais que vous devriez toujours l'utiliser concat. Dans l'exemple par var a = 1 + 2 + " should be 12";rapport à la version concat de this var a = "".concat(1).concat(2).concat(" should be 12");. L'utilisation de concat vous évitera beaucoup de problèmes +pour le calcul, pas pour la concaténation.
Eric Herlitz

3
hostnamedonnera seulement le domaine et hostfournira le port également. C'est un excellent mini-outil pour voir l'anatomie du lien bl.ocks.org/abernier/3070589
Lukas Liesis

4
window.location.origin fonctionne bien aussi - il inclut le protocole et le port.
rothschild86

96

Pour obtenir le nom d'hôte: location.hostname

Mais votre exemple recherche également le schéma, il location.originsemble donc faire ce que vous voulez dans Chrome, mais n'est pas mentionné dans la documentation de Mozdev. Vous pouvez le construire avec

location.protocol + '//' + location.hostname

Si vous voulez également le numéro de port (quand ce n'est pas 80), alors:

location.protocol + '//' + location.host

Firefox 4 ne semble pas l'avoir, contrairement à Chrome 12. Est-il défini dans une spécification?
Delan Azabani

Salut..Pour obtenir le port, l'exemple a fonctionné comme un charme..Merci pour cela
karthik k

FF prend en charge location.origin depuis 21.0: developer.mozilla.org/en-US/docs/Web/API/Window.location
zifot

67

Vous pouvez obtenir le protocole, l'hôte et le port en utilisant ceci:

window.location.origin

Compatibilité du navigateur

Bureau

| Chrome                           | Edge  | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit)                            |
|----------------------------------|-------|-----------------|-------------------|-------|--------------------------------------------|
| (Yes)                            | (Yes) | (Yes)           | (Yes)             | (Yes) | (Yes)                                      |
| 30.0.1599.101 (possibly earlier) | ?     | 21.0 (21.0)     | 11                | ?     | 7 (possibly earlier, see webkit bug 46558) |

Mobile

| Android                          | Edge  | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile                              |
|----------------------------------|-------|------------------------|----------|--------------|--------------------------------------------|
| (Yes)                            | (Yes) | (Yes)                  | (Yes)    | (Yes)        | (Yes)                                      |
| 30.0.1599.101 (possibly earlier) | ?     | 21.0 (21.0)            | ?        | ?            | 7 (possibly earlier, see webkit bug 46558) |

Toute compatibilité avec les navigateurs provient du Mozilla Developer Network


4
Je devrais mentionner que IE ne le soutient pas.
Monso

Veuillez mentionner qu'il s'agit d'une nouvelle fonctionnalité et non prise en charge par les anciens navigateurs.
kabirbaidhya

@kabirbaidhya Et la compatibilité verbeuse!
Monso

Bien. Mais que se passe-t-il lorsque les gars de MDN mettent à jour le tableau de compatibilité du navigateur, ce qui arrive assez souvent avec les nouvelles versions de navigateur. Vous devrez peut-être continuer à mettre à jour ceci pour synchroniser avec leur table;).
kabirbaidhya

Pas vraiment, il s'agit de la première version connue pour la prendre en charge, pas de la dernière et tous les navigateurs consultés la prennent déjà en charge. Cela ne changerait que s'ils décident d'inclure un autre navigateur ou peuvent déterminer les numéros de version sur certains des navigateurs pris en charge, ce qui est quelque peu discutable car la plupart des plus récents datent de leur version initiale.
Monso

7
let path = window.location.protocol + '//' + window.location.hostname + ':' + window.location.port;


5

Selon vos besoins, vous pouvez utiliser l'une des window.locationpropriétés. Dans votre question, vous posez des questions sur l' hôte , qui peut être récupéré en utilisant window.location.hostname(par exemple www.example.com). Dans votre exemple, vous montrez quelque chose qui s'appelle l' origine , qui peut être récupéré en utilisant window.location.origin(par exemple http://www.example.com).

var path = window.location.origin + "/";

//result = "http://localhost:60470/"

2

J'aime celui-ci selon le but

window.location.href.split("/")[2] == "localhost:17000" //always domain + port

Vous pouvez l'appliquer sur n'importe quelle chaîne d'URL

var url = "http://localhost:17000/sub1/sub2/mypage.html?q=12";
url.split("/")[2] == "localhost:17000"
url.split("/")[url.split("/").length-1] == "mypage.html?q=12"

Suppression du protocole, du domaine et du chemin de la chaîne d'URL (chemin relatif)

var arr = url.split("/");
if (arr.length>3)
   "/" + arr.splice(3, arr.length).join("/") == "/sub1/sub2/mypage.html?q=12"
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.