How to get base url with jquery or javascript

Question

In joomla php there I can use  this- gt baseurl to get the base path  but I wanted to get the base path in jquery   The base path may be any of the following example   http   www example com  http   localhost example http   www example com sub example   The example may also change

User · Answer

You mentioned that the example com may change so I suspect that actually you need the base url just to be able to use relative path notation for your scripts  In this particular case there is no need to use scripting - instead add the base tag to your header    lt head gt     lt base href  http   www example com   gt   lt  head gt    I usually generate the link via PHP

User · Answer

I would recommend for everyone to create HTML base tag in development  then assign the href dynamically  so in production whatever host a client uses  it will automacically addapt to it    lt html gt    lt title gt Some page title lt  titile gt     lt script type  text javascript  gt      var head    document getElementsByTagName  head   0       var base   document createElement  base        base href   window document location origin      head appendChild base      lt  script gt    lt  head gt         So if you are in localhot 8080  you will reach every linked or referenced file from the base  eg  http   localhost 8080 some path file html If you are in www example com  it will be http   www example com some path file html  Also note that  every location you re on  you should not use references like globs in hrefs  eg  Parent location causes http   localhost 8080  not http   localhost 8080 some path     Pretent you reference all hyperlinks as full sentenced without the bas url

User · Answer

I am surprised that non of the answers consider the base url if it was set in  lt base gt  tag  All current answers try to get the host name or server name or first part of address  This is the complete logic which also considers the  lt base gt  tag  which may refer to another domain or protocol     function getBaseURL      var elem document getElementsByTagName  base   0     if  typeof elem      undefined   amp  amp  elem    null        return elem href        return window location origin      Jquery format   function getBaseURL      if     base   length        return    base   attr  href          return window location origin      Without getting involved with the logic above  the shorthand solution which considers both  lt base gt  tag and window location origin   Js   var a document createElement  a    a href      var baseURL  a href    Jquery   var baseURL      lt a href     gt    0  href   Final note  for a local file in your computer  not on a host  the window location origin only returns the file    but the sorthand solution above returns the complete correct path

User · Answer

Easy       lt img src  gt    0  src   Generates a img with empty src-name forces the browser to calculate the base-url by itself  no matter if you have  index html or anything else

User · Answer

Here s a short one   x000D   x000D  const base   new URL      location href  href   console log base   x000D   x000D   x000D

User · Answer

Split and join the URL   const s    http   free-proxy cz en abc  console log s split      slice 0 3  join

User · Answer

Getting the base url  Calls controller from 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  quot GET quot   url   xhr send      object use to send  xhr onreadystatechange function         if xhr readyState  4  amp  amp  this status  200      console log xhr responseText     the response of the request           document getElementById  quot id from where you called the function quot   innerHTML   xhr responseText

User · Answer

This is not possible from javascript  because this is a server-side property  Javascript on the client cannot know where joomla is installed  The best option is to somehow include the value of  this- gt baseurl into the page javascript and then use this value  phpBaseUrl    You can then build the url like this   var loc   window location  var baseUrl   loc protocol          loc hostname    loc port      loc port               phpBaseUrl

User · Answer

the easiest way to get base url in JavaScript window location origin

User · Answer

I ve run into this need on several Joomla project   The simplest way I ve found to address is to add a hidden input field to my template    lt input type  hidden  id  baseurl  name  baseurl  value   lt  php echo  this- gt baseurl    gt     gt    When I need the value in JavaScript   var baseurl   document getElementById  baseurl   value    Not as fancy as using pure JavaScript but simple and gets the job done

User · Answer

The format is hostname pathname search  So the url is     var url   window location hostname   window location pathname   window location hash   For your case   window location hostname    stackoverflow com  window location pathname    questions 25203124 how-to-get-base-url-with-jquery-or-javascript  window location hash        So basically the baseurl   hostname   window location hostname

User · Answer

This one will help you     var getUrl   window location  var baseUrl   getUrl  protocol          getUrl host         getUrl pathname split      1

User · Answer

This is an extremely old question  but here are the approaches I personally use       Get Standard Base URL  As many have already stated  this works for most situations   var url   window location origin      Get Absolute Base URL  However  this simple approach can be used to strip off any port numbers     var url    http       location host split      0     Edit  To address the concern  posed by Jason Rice  the following can be used to automatically insert the correct protocol type      var url   window location protocol          location host split      0       Set Base URL  As a bonus -- the base URL can then be redefined globally     document head innerHTML   document head innerHTML     lt base href      url        gt

User · Answer

Here s something quick that also works with file    URLs   I came up with this one-liner      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

User · Answer

You can easily get it with  var currentUrl   window location href   or  if you want the original URL  use  var originalUrl   window location origin

User · Answer

This will get base url  var baseurl   window location origin window location pathname

User · Answer

I think it will ok for you  var base url   window location origin   var host   window location host   var pathArray   window location pathname split

User · Answer

var getUrl   window location  var baseUrl   getUrl  protocol          getUrl host         getUrl pathname split      1

User · Answer

Put this in your header  so it will be available whenever you need it   var base url     lt  php echo base url     gt      You will get http   localhost 81 your-path-file or http   localhost your-path-file

User · Answer

I was just on the same stage and this solution works for me  In the view   lt  php      document   JFactory  getDocument          document- gt addScriptDeclaration  var base       JURI  base               document- gt addScript  components com name js filter js      gt    In js file you access base as a variable for example in your scenario   console log base     will print    http   www example com     http   localhost example    http   www example com sub example   I do not remember where I take this information to give credit  if I find it I will edit the answer

User · Answer

window location origin     window location pathname split      1      page     page   list jsp    almost same as Jenish answer but a little shorter

User · Answer

Had the same issue a while ago  my problem was  I simply needed the base url  There are a lot of detailed options here but to get around this  simply use the window location object  Actually type this in the browser console and hit enter to select your options there  Well for my case it was simply    window location origin

User · Answer

document baseURI returns base URL also respecting the value in  lt base  gt  tag https   developer mozilla org en-US docs Web API Node baseURI

User · Answer

var getUrl   window location  var baseurl   getUrl origin    or var baseurl    getUrl origin        getUrl pathname split      1      But you can t say that the baseurl   of CodeIgniter or php joomla  will return the same value  as it is possible to change the baseurl in the  htaccess file of these frameworks   For example     If you have an  htaccess file like this in your localhost    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    The  this- baseurl   will return http   localhost CodeIgniter

User · Answer

In case anyone would like to see this broken out into a very robust function      function getBaseURL             var loc   window location          var baseURL   loc protocol          loc hostname          if  typeof loc port      undefined   amp  amp  loc port         baseURL          loc port             strip leading           var pathname   loc pathname          if  pathname length  gt  0  amp  amp  pathname substr 0 1           pathname   pathname substr 1  pathname length - 1           var pathParts   pathname split               if  pathParts length  gt  0                for  var i   0  i  lt  pathParts length  i                      if  pathParts i          baseURL          pathParts i                                   return baseURL

[javascript] How to get base url with jquery or javascript?

Examples related to javascript

Examples related to jquery