Como obter o URL base com jquery ou javascript?

No joomla php lá eu posso usar $this->baseurlpara obter o caminho base, mas eu queria obter o caminho base no jquery.

O caminho base pode ser qualquer um dos seguintes exemplos:

http://www.example.com/
http://localhost/example
http://www.example.com/sub/example

O exampletambém pode mudar.

Este irá ajudá-lo ...

var getUrl = window.location;
var baseUrl = getUrl .protocol + "//" + getUrl.host + "/" + getUrl.pathname.split('/')[1];

Acho que vai dar certo pra você

var base_url = window.location.origin;

var host = window.location.host;

var pathArray = window.location.pathname.split( '/' );

Isso obterá o URL base

var baseurl = window.location.origin+window.location.pathname;

Essa é uma pergunta extremamente antiga, mas aqui estão as abordagens que eu pessoalmente uso ...

Obter URL padrão / base

Como muitos já afirmaram, isso funciona para a maioria das situações.

var url = window.location.origin;

Obter URL base absoluto

No entanto, essa abordagem simples pode ser usada para remover qualquer número de porta.

var url = "http://" + location.host.split(":")[0];

Edit: Para abordar a preocupação, apresentada por Jason Rice , o seguinte pode ser usado para inserir automaticamente o tipo de protocolo correto ...

var url = window.location.protocol + "//" + location.host.split(":")[0];

Definir URL base

Como um bônus - o URL base pode ser redefinido globalmente.

document.head.innerHTML = document.head.innerHTML + "<base href='" + url + "' />";

Isso não é possível no javascript, porque esta é uma propriedade do servidor. Javascript no cliente não pode saber onde o joomla está instalado. A melhor opção é incluir de alguma forma o valor de $this->baseurlna página javascript e, em seguida, usar esse valor ( phpBaseUrl).

Você pode criar o URL assim:

var loc = window.location;
var baseUrl = loc.protocol + "//" + loc.hostname + (loc.port? ":"+loc.port : "") + "/" + phpBaseUrl;

document.baseURIretorna o URL base também respeitando o valor na <base/>tag https://developer.mozilla.org/en-US/docs/Web/API/Node/baseURI

Teve o mesmo problema há um tempo atrás, meu problema era: eu simplesmente precisava do URL base. Existem muitas opções detalhadas aqui, mas para contornar isso, basta usar o window.locationobjeto. Na verdade, digite isso no console do navegador e pressione Enter para selecionar suas opções. Bem, para o meu caso, era simplesmente:

window.location.origin

var getUrl = window.location;
var baseurl = getUrl.origin; //or
var baseurl =  getUrl.origin + '/' +getUrl.pathname.split('/')[1]; 

Mas você não pode dizer que a baseurl () do CodeIgniter (ou php joomla) retornará o mesmo valor, pois é possível alterar a baseurl no arquivo .htaccess dessas estruturas.

Por exemplo :

Se você tiver um arquivo .htaccess como este em seu host local:

RewriteEngine on
RewriteBase /CodeIgniter/
RewriteCond $1 !^(index.php|resources|robots.txt)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L,QSA]

O $ this-> baseurl () retornará http: // localhost / CodeIgniter /

Eu me deparei com essa necessidade em vários projetos do Joomla. A maneira mais simples de encontrar o endereço é adicionar um campo de entrada oculto ao meu modelo:

<input type="hidden" id="baseurl" name="baseurl" value="<?php echo $this->baseurl; ?>" />

Quando preciso do valor em JavaScript:

var baseurl = document.getElementById('baseurl').value;

Não é tão chique quanto usar JavaScript puro, mas simples e faz o trabalho.

a maneira mais fácil de obter o URL base no jQuery

window.location.origin

Eu recomendaria a todos que criassem a tag base HTML no desenvolvimento e atribuíssem o href dinamicamente, para que, na produção, seja qual for o host que um cliente use, ele será automaticamente adicionado a ele:

<html>
 <title>Some page title</titile>
  <script type="text/javascript">
    var head  = document.getElementsByTagName('head')[0];
    var base = document.createElement("base");
    base.href = window.document.location.origin;
    head.appendChild(base);
  </script>
 </head>
 ...

Portanto, se você estiver em localhot: 8080, alcançará todos os arquivos vinculados ou referenciados a partir da base, por exemplo: http://localhost:8080/some/path/file.html se estiver em www.example.com, seráhttp://www.example.com/some/path/file.html

Observe também que, em todos os locais em que você está, você não deve usar referências como globs em hrefs, por exemplo: O local pai http://localhost:8080/não http://localhost:8080/some/path/.

Pretenda que você faça referência a todos os hiperlinks como sentenciados completos, sem o URL básico.

O formato é nome do host / nome do caminho / pesquisa

Portanto, o URL é:

var url = window.location.hostname + window.location.pathname + window.location.hash

Para o seu caso

window.location.hostname = "stackoverflow.com"
window.location.pathname ="/questions/25203124/how-to-get-base-url-with-jquery-or-javascript"
window.location.hash = ""

Então, basicamente, o baseurl = hostname = window.location.hostname

Surpreende-me que nenhuma das respostas considere o URL base se ele tiver sido definido na <base>tag. Todas as respostas atuais tentam obter o nome do host ou o nome do servidor ou a primeira parte do endereço. Essa é a lógica completa que também considera a <base>tag (que pode se referir a outro domínio ou protocolo):

function getBaseURL(){
  var elem=document.getElementsByTagName("base")[0];
  if (typeof(elem) != 'undefined' && elem != null){
     return elem.href;
  }
  return window.location.origin;
}

Formato Jquery:

function getBaseURL(){
  if ($("base").length){
     return $("base").attr("href");
  }
  return window.location.origin;
}

Sem se envolver com a lógica acima, a solução abreviada que considera a <base>tag e window.location.origin:

Js:

var a=document.createElement("a");
a.href=".";
var baseURL= a.href;

Jquery:

var baseURL= $('<a href=".">')[0].href

Nota final: para um arquivo local no seu computador (não em um host), o window.location.originúnico retorna a file://solução, mas a classificação acima, retorna o caminho correto completo.

window.location.origin+"/"+window.location.pathname.split('/')[1]+"/"+page+"/"+page+"_list.jsp"

quase igual à resposta de Jenish, mas um pouco mais curta.

Eu estava no mesmo palco e esta solução funciona para mim

Na vista

<?php
    $document = JFactory::getDocument();

    $document->addScriptDeclaration('var base = \''.JURI::base().'\'');
    $document->addScript('components/com_name/js/filter.js');
?>

No arquivo js, ​​você acessa basecomo uma variável, por exemplo, no seu cenário:

console.log(base) // will print
// http://www.example.com/
// http://localhost/example
// http://www.example.com/sub/example

Não me lembro de onde tomo essas informações para dar crédito; se eu as encontrar, editarei a resposta

var getUrl = window.location;
var baseUrl = getUrl .protocol + "//" + getUrl.host + "/" + getUrl.pathname.split('/')[1];

Aqui está algo rápido que também funciona com file://URLs.

Eu vim com essa frase:

[((1!=location.href.split(location.href.split("/").pop())[0].length?location.href.split(location.href.split("/").pop())[0]:(location.protocol,location.protocol+"//" + location.host+"/"))).replace(location.protocol+"//"+location.protocol+"//"+location.protocol+"://")]

Você mencionou que isso example.compode mudar, então eu suspeito que, na verdade, você precisa do URL base apenas para poder usar a notação de caminho relativo para seus scripts. Nesse caso em particular, não há necessidade de usar scripts - em vez disso, adicione a tag base ao seu cabeçalho:

<head>
  <base href="http://www.example.com/">
</head>

Normalmente, eu gero o link via PHP.

Caso alguém queira ver isso dividido em uma função muito robusta

    function getBaseURL() {
        var loc = window.location;
        var baseURL = loc.protocol + "//" + loc.hostname;
        if (typeof loc.port !== "undefined" && loc.port !== "") baseURL += ":" + loc.port;
        // strip leading /
        var pathname = loc.pathname;
        if (pathname.length > 0 && pathname.substr(0,1) === "/") pathname = pathname.substr(1, pathname.length - 1);
        var pathParts = pathname.split("/");
        if (pathParts.length > 0) {
            for (var i = 0; i < pathParts.length; i++) {
                if (pathParts[i] !== "") baseURL += "/" + pathParts[i];
            }
        }
        return baseURL;
    }

Fácil

$('<img src=>')[0].src

Gera um img com src-name vazio força o navegador a calcular o URL-base sozinho, não importa se você possui /index.htmlou qualquer outra coisa.

Divida e junte-se ao URL:

const s = 'http://free-proxy.cz/en/abc'
console.log(s.split('/').slice(0,3).join('/'))

Coloque isso no seu cabeçalho, para que fique disponível sempre que você precisar.

var base_url = "<?php echo base_url();?>";

Você receberá http://localhost:81/your-path-fileou http://localhost/your-path-file.