如何使用jquery或javascript获取基本URL?

时间:2014-08-08 12:04:53

标签: javascript jquery

在joomla php中,我可以使用$this->baseurl来获取基本路径,但我想在jquery中获取基本路径。

基本路径可以是以下任何示例:

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

example也可能会改变。

25 个答案:

答案 0 :(得分:134)

这个会帮助你......

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

答案 1 :(得分:87)

我认为你会好的

var base_url = window.location.origin;

var host = window.location.host;

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

答案 2 :(得分:22)

这将获得基本网址

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

答案 3 :(得分:12)

这不可能来自javascript,因为这是服务器端属性。客户端上的Javascript无法知道joomla的安装位置。最好的选择是以某种方式将$this->baseurl的值包含在页面javascript中,然后使用此值(phpBaseUrl)。

然后您可以像这样建立网址:

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

答案 4 :(得分:5)

我在几个Joomla项目中遇到了这种需求。我发现解决的最简单方法是在模板中添加隐藏的输入字段:

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

当我需要JavaScript中的值时:

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

不像使用纯JavaScript那样花哨,但很简单并完成工作。

答案 5 :(得分:5)

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

但是您不能说CodeIgniter(或php joomla)的baseurl()将返回相同的值,因为可以在这些框架的.htaccess文件中更改baseurl。

例如:

如果您的本地主机具有这样的.htaccess文件:

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]

$ this-> baseurl()将返回http://localhost/CodeIgniter/

答案 6 :(得分:4)

前段时间有同样的问题,我的问题是,我只需要基本URL。这里有很多详细的选项,但是要解决此问题,只需使用window.location对象。 实际上是在浏览器控制台中键入此内容,然后按Enter键以在那里选择您的选项。对我来说,这很简单:

window.location.origin

答案 7 :(得分:4)

document.baseURI返回基本URL,同时也遵守<base/>标签中的值 https://developer.mozilla.org/en-US/docs/Web/API/Node/baseURI

答案 8 :(得分:4)

您可以轻松获得它:

var currentUrl = window.location.href;

或者,如果您想要原始URL,请使用:

var originalUrl = window.location.origin;

答案 9 :(得分:3)

我建议每个人在开发中创建HTML基本标记,然后动态分配href,因此在生产中,无论客户端使用什么主机,它都会自动添加到它:

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

因此,如果你在localhot:8080,你将从基地到达每个链接或引用的文件,例如:http://localhost:8080/some/path/file.html 如果您在www.example.com,则会http://www.example.com/some/path/file.html

另请注意,您所在的每个位置都不应在href中使用像globs这样的引用,例如:父位置会导致http://localhost:8080/而不是http://localhost:8080/some/path/

在没有bas url的情况下,您将所有超链接引用为完整的句子。

答案 10 :(得分:3)

这里很短:

const base = new URL('/', location.href).href;

console.log(base);

答案 11 :(得分:3)

格式为hostname / pathname / search

所以网址是:

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

对于你的情况

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

所以基本上是baseurl = hostname = window.location.hostname

答案 12 :(得分:3)

在jQuery中获取基本网址的最简单方法

window.location.origin

答案 13 :(得分:2)

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

与Jenish的回答几乎相同但有点短。

答案 14 :(得分:1)

令我惊讶的是,如果答案是在<base>标签中设置的,则没有答案会考虑该基本URL。当前所有答案都尝试获取主机名或服务器名或地址的第一部分。这是完整的逻辑,还考虑了<base>标记(可能引用另一个域或协议):

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

jQuery格式:

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

在不涉及上述逻辑的情况下,速记解决方案同时考虑了<base>标签和window.location.origin

Js:

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

jQuery:

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

最后的提示:对于您计算机(而不是主机)中的本地文件,window.location.origin仅返回file://,但上述排序方法将返回完整的正确路径

答案 15 :(得分:1)

这是一个非常老的问题,但这是我个人使用的方法...

获取标准/基本URL

正如许多人所说,这在大多数情况下都适用。

var url = window.location.origin;


获取绝对基本URL

但是,可以使用这种简单方法剥离所有端口号。

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


设置基本URL

此外,基本URL可以在全局范围内重新定义。

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

答案 16 :(得分:1)

这里有一些快速的功能,也适用于file://网址。

我想出了这个单行:

[((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+"://")]

答案 17 :(得分:1)

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

答案 18 :(得分:1)

我刚刚站在同一个舞台上,这个解决方案适合我

在视图中

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

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

在js文件中,您可以访问base作为变量,例如在您的方案中:

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

我不记得我把这些信息放在哪里给予赞扬,如果我发现它我会编辑答案

答案 19 :(得分:0)

轻松

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

生成一个带有空src-name的img强制浏览器自行计算base-url,无论你有/index.html还是其他任何东西。

答案 20 :(得分:0)

如果有人希望将此视图分解为非常强大的功能

    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;
    }

答案 21 :(得分:0)

分割并加入URL:

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

答案 22 :(得分:0)

您提到example.com可能会发生变化,所以我怀疑实际上您需要基本网址才能为脚本使用相对路径表示法。在这种特殊情况下,不需要使用脚本 - 而是将基本标记添加到标题中:

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

我通常通过PHP生成链接。

答案 23 :(得分:0)

获取基本网址 |从js调用控制器

function getURL() {

var windowurl = window.location.href;
var baseUrl = windowurl.split('://')[1].split('/')[0]; //split function

var xhr = new XMLHttpRequest();
var url='http://'+baseUrl+'/url from controller';
xhr.open("GET", url);
xhr.send(); //object use to send

xhr.onreadystatechange=function() {
    if(xhr.readyState==4 && this.status==200){
 //console.log(xhr.responseText); //the response of the request
        
 document.getElementById("id from where you called the function").innerHTML = xhr.responseText;
}
  }
}

答案 24 :(得分:-3)

将它放在标题中,以便在需要时随时可用。

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

您将获得http://localhost:81/your-path-filehttp://localhost/your-path-file