What is the best way to set up base url for ajax request using Jquery?

Question

Since phonegap is based on local html file it doesn't know about base url of remote server. I wonder what is the best way to set base url for ajax requests using jquery? Could anybody provide link to sample?

Currently i think about using jquery ajax prefilter.

Answer 1

Both of the established answers have major drawbacks. Requiring a function to be called to massage your URL every time you make a request is a lot of extra typing. Adding a base tag to a page works great most of the time, but it causes some trouble if you're doing heavy duty work with SVGs. Here's a simple solution that fixes all your URLs at once without using the base tag.

var baseUrl = 'http://my.hardcoded.url/';
$.ajaxSetup({
    beforeSend: function(xhr, options) {
        options.url = baseUrl + options.url;
    }
})

Answer 2

You can also place a check to skip urls starting with http (probably cross-domain urls).

Make sure to place it right after including the jQuery file and before all ajax calls.

const baseUrl = 'http://example.com/sub/directory';

$.ajaxSetup({
  beforeSend: function(xhr, options) {
     if( options.url.indexOf('http') !== 0 ) {
        options.url = baseUrl + options.url;
     }
  }
});