8

So I am writing a jquery Plugin using grunt, and in my plugin I also need to call webservices.

The webservice url domain will always be the same domain as the location of the .js file the user needs to add for our plugin. So i.e. Relative

1) Include JS file for plugin

http://mydomain1/js/myfile.js

2) In my JS call API URL

Needs to be

api_domain: "http://mydomain1/api/v1"

And I want the api domain to be relative to domain of the JS file calling it I tried doing

api_domain: "/mydomain1/api/v1"

But this picks up the domain name of the browser.

So I was wondering what the best way to achieve this

1) Use a .NET Handler to insert the right domain name from context.request.url

2) In Grunt build create a specific .js for each environment I will deploy to which has the full url in the JS

3) Other Options ?

1
  • All the client side solutions are a bit dangerous/fragile. I'd recommend the server side solutions you yourself suggested; render the javascript file on each application server and let the client receive a hardcoded value.
    – Brian
    Jun 14, 2015 at 3:58

3 Answers 3

3
+100

Well you could actually have the script find it's own source using jquery. Just make sure to give the js file a unique enough name.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/demux/4d4ce440d7c379305a9a/raw/findfilehosttest.js"></script>

Actual Script:

$(function(){
    var url = $("script[src$='findfilehosttest.js']").attr('src')
    var matches = url.match(/^https?\:\/\/([^\/?#]+)(?:[\/?#]|$)/i)
    var domain = matches && matches[1]
    alert(domain)
})

But in general I think it's best to keep it simple. So allow the user to set the URL of the server manually, like so:

<script>
    var MY_API_URL = 'https://instance1.myapiserver.foo'
</script>
<script src="/whateverpath/myapiscript.js"></script>

This would also allow them to host the script on their own server, or even proxy it for what ever reason they might have.

1

Will your JS file be on the same domain as the web page? In that case, simply use window.location.host in your plugin to get "http://mydomain".

2
  • Nope it won't be, we will host the JS file and it can go on any user website.
    – StevieB
    Jun 8, 2015 at 8:19
  • But your script will be deployed on various environments? (If it were not the case, you would hardcode the domain name in the script, quick and dirty...). Jun 8, 2015 at 16:16
0

You tried to do this in your JS file ?

var api_version = "v1";
var api_domain = (function () {

var scripts = document.getElementsByTagName('script');
var script = scripts[scripts.length - 1];
var domain;

if (script.getAttribute.length !== undefined) {
    domain = script.src;
} else {
    domain = script.getAttribute('src', -1);
}

domain = domain.split('/');
domain.pop();
domain = domain.join('/');

var tmp = document.createElement('a');
tmp.href = domain;

var port = tmp.port !== "80" ? ":" + tmp.port : "";

return tmp.protocol + '//' + tmp.hostname + port + '/api/' + api_version;

}());

You will have on api_domain your required value.

Not the answer you're looking for? Browse other questions tagged or ask your own question.