cómo obtener la URL del host usando JavaScript desde la página actual

183

Dado que estoy en la siguiente página:

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

¿Cómo puedo recuperar el nombre de host ( "http://www.webmail.com") con JavaScript?

javascript karthik k
fuente
3
posible duplicado de Obtener nombre de host en JavaScript
T.Todua

Respuestas:

319 
var host = window.location.hostname;

o posiblemente

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

o si te gusta la concatenación 

var protocol = location.protocol;
var slashes = protocol.concat("//");
var host = slashes.concat(window.location.hostname);
Eric Herlitz
fuente
3
Tal vez no especifique httpsin embargo Usa el protocolo relativo. Podría ser más apropiado que uno de codificación rígida.
Darth Egregious
33
Use window.location.host en lugar de hostname, o fallará si el puerto no es 80.
Stefan Steiger
1
@MattBrowne Cuando trabaje con algo que produzca una cadena, diría que siempre debe usar concat. En el ejemplo var a = 1 + 2 + " should be 12";vs la versión concat de esto var a = "".concat(1).concat(2).concat(" should be 12");. El uso de concat le ahorrará muchos problemas +para el cálculo, no para la concatenación.
Eric Herlitz
3
hostnamesolo dará dominio y hostproporcionará puerto también. Esta es una gran mini herramienta para ver la anatomía del enlace bl.ocks.org/abernier/3070589
Lukas Liesis
44
window.location.origin también funciona bien: incluye el protocolo y el puerto.
rothschild86
96

Para obtener el nombre de host: location.hostname

Pero su ejemplo también busca el esquema, por lo que location.originparece hacer lo que desea en Chrome, pero no se menciona en los documentos de Mozdev. Puedes construirlo con

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

Si también desea el número de puerto (para cuando no es 80), entonces:

location.protocol + '//' + location.host
Quentin
fuente
Firefox 4 no parece tenerlo, aunque Chrome 12 sí. ¿Está definido en una especificación?
Delan Azabani
Hola ... Para obtener el puerto, el ejemplo funcionó de maravilla ... Gracias por eso
karthik k
FF admite location.origin desde 21.0: developer.mozilla.org/en-US/docs/Web/API/Window.location
zifot
67

Puede obtener el protocolo, el host y el puerto con esto:

window.location.origin

Compatibilidad del navegador

Escritorio

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

Móvil

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

Toda la compatibilidad del navegador es de Mozilla Developer Network

Monso
fuente
44
Debo mencionar que IE no es compatible con esto.
Monso
Mencione que es una característica nueva y no es compatible con los navegadores antiguos.
kabirbaidhya
@kabirbaidhya ¿Qué tal la compatibilidad detallada?
Monso
Bueno. Pero, ¿qué sucede cuando los chicos de MDN actualizan la tabla de compatibilidad del navegador? Es posible que deba seguir actualizando esto para sincronizar con su tabla;).
kabirbaidhya
En realidad no, estas son las primeras versiones conocidas para admitirlo, no la última y todos los navegadores que miran ya lo admiten. Esto solo cambiaría si deciden incluir otro navegador o pueden averiguar los números de versión en algunos de los navegadores compatibles, lo que es algo discutible ya que la mayoría de los nuevos son de su versión inicial.
Monso
7 
let path = window.location.protocol + '//' + window.location.hostname + ':' + window.location.port;
usuario3601578
fuente
6

Esto debería funcionar:

window.location.hostname
GordyD
fuente
o hostsi también necesita puerto
Lukas Liesis
5

Dependiendo de sus necesidades, puede usar una de las window.locationpropiedades. En su pregunta, está preguntando sobre el host , que puede recuperarse usando window.location.hostname(por ejemplo www.example.com). En su ejemplo, está mostrando algo que se llama origen , que puede recuperarse usando window.location.origin(por ejemplo http://www.example.com).

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

//result = "http://localhost:60470/"
Mahmoud salah eldien saber
fuente
2

Me gusta este dependiendo del propósito

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

Puedes aplicarlo en cualquier url-string

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"

Eliminar el protocolo, el dominio y la ruta de url-string (ruta relativa)

var arr = url.split("/");
if (arr.length>3)
   "/" + arr.splice(3, arr.length).join("/") == "/sub1/sub2/mypage.html?q=12"
Gosso
fuente