como obter o URL do host usando javascript na página atual

183

Dado que estou na página seguinte:

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

Como recuperar o nome do host ( "http://www.webmail.com") com JavaScript?

karthik k
fonte
3
possível duplicata de nome de host Get em JavaScript
T.Todua

Respostas:

319
var host = window.location.hostname;

ou possivelmente

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

ou se você gosta de concatenação

var protocol = location.protocol;
var slashes = protocol.concat("//");
var host = slashes.concat(window.location.hostname);
Eric Herlitz
fonte
3
Talvez não especifique httpembora. Use o protocolo relativo. Pode ser mais apropriado do que um código embutido.
Darth Egregious
33
Use window.location.host vez de hostname, ou falhará se a porta não é 80.
Stefan Steiger
1
@ MattBrowne Ao trabalhar com algo que deve produzir uma string, eu diria que você deve sempre usar concat. No exemplo var a = 1 + 2 + " should be 12";vs a versão concat disso var a = "".concat(1).concat(2).concat(" should be 12");. O uso da concat vai lhe poupar muitos problemas, +é para o cálculo, não para a concatenação.
precisa
3
hostnamedará apenas domínio e hosttambém fornecerá porta. Esta é uma excelente mini ferramenta para ver o link anatomia bl.ocks.org/abernier/3070589
Lukas Liesis
4
window.location.origin também funciona bem - inclui o protocolo e a porta.
precisa
96

Para obter o nome do host: location.hostname

Mas seu exemplo também está procurando o esquema, então location.originparece fazer o que você deseja no Chrome, mas não é mencionado nos documentos do Mozdev. Você pode construí-lo com

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

Se você quiser o número da porta também (para quando não for 80), então:

location.protocol + '//' + location.host
Quentin
fonte
O Firefox 4 parece não ter, embora o Chrome 12 tenha. É definido em uma especificação?
Delan Azabani
Hi..For ficando a porta, o exemplo funcionou como um charm..Thanks para que
karthik k
O FF suporta location.origin desde 21.0: developer.mozilla.org/en-US/docs/Web/API/Window.location
zifot
67

Você pode obter o protocolo, host e porta usando este:

window.location.origin

Compatibilidade do navegador

Área de Trabalho

| 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óvel

| 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 a compatibilidade do navegador é da Mozilla Developer Network

Monso
fonte
4
Devo mencionar que o IE não suporta isso.
Monso
Mencione que esse é um novo recurso e não é suportado por navegadores antigos.
kabirbaidhya
@kabirbaidhya Que tal compatibilidade detalhada!
Monso
Boa. Mas o que acontece quando os caras do MDN atualizam a tabela de compatibilidade do navegador, o que acontece com bastante frequência com as versões mais recentes do navegador. Pode ser necessário continuar atualizando isso para sincronizar com a tabela deles;).
Kabirbaidhya #
Na verdade, essas são as versões conhecidas mais antigas para suportá-las, não as mais recentes, e todos os navegadores que eles olham já suportam. Isso só mudaria se eles decidissem incluir outro navegador para descobrir os números de versão em alguns navegadores suportados, o que é um tanto discutível, já que a maioria dos mais novos é de seu lançamento inicial.
Monso
7
let path = window.location.protocol + '//' + window.location.hostname + ':' + window.location.port;
user3601578
fonte
6

Isso deve funcionar:

window.location.hostname
GordyD
fonte
ou hostse você também precisa porta
Lukas Liesis
5

Dependendo das suas necessidades, você pode usar uma das window.locationpropriedades. Na sua pergunta, você está perguntando sobre o host , que pode ser recuperado usando window.location.hostname(por exemplo www.example.com). No seu exemplo, você está mostrando algo chamado origem , que pode ser recuperado usando window.location.origin(por exemplo http://www.example.com).

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

//result = "http://localhost:60470/"
Mahmoud salah eldien sabre
fonte
2

Eu gosto deste dependendo do propósito

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

Você pode aplicá-lo em qualquer string de 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"

Remoção de protocolo, domínio e caminho da string de URL (caminho relativo)

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