从请求脚本的地方获取主机

Question

I have a script that other people request on their websites from my host. I have multiple environments (dev/test/production), and within my script, I want to know the environment from which it has been loaded.

For example, I'm serving script.js at the following sites (the file is the same on all sites):

dev.mysite.com/script.js
test.mysite.com/script.js
www.mysite.com/script.js

Someone loads my script as:

<script src="dev.mysite.com/script.js"></script>

So within script.js , I want to have some code which is able to get the host from which the script itself has been requested from:

var getHost = function() {
  var host = // host from where it has been requested
  return host; // in this case it should return dev.mysite.com
};

How can I accomplish this?

Answer 1

I've had difficulty in understanding what you're really after, but you can loop through all the scripts and parse the src .

jQuery:

function getHosts(scriptName){
   var hosts  = [];
   scriptName = scriptName.replace(/([.])/g,"\\$1"); // escape special characters

   $('script').each(function(){
      var _src    = this.src;

      if ( RegExp(scriptName).test(_src) ){
         _src = _src.replace(/^https*:\/\//,'');     // remove protocol
         _src = _src.replace(/\/.*$/,'');            // remove rest of path
         hosts[hosts.length] = _src;                 // store it for return
      }
   });

   return hosts;                                     // return results as array
}

alert( getHosts('script.js').join(',') );

---

And w/o jQuery:

function getHosts(scriptName){
   var hosts  = [];
   scriptName = scriptName.replace(/([.])/g,"\\$1"); // escape special characters

   var scripts = document.getElementsByTagName('script');
   for (var n=scripts.length;n--;){
      var _src = scripts[n].src;

      if ( RegExp(scriptName).test(_src) ){
         _src = _src.replace(/^https*:\/\//,'');     // remove protocol
         _src = _src.replace(/\/.*$/,'');            // remove rest of path
         hosts[hosts.length] = _src;                 // store it for return
      }
   }

   return hosts;                                     // return results as array
}

alert( getHosts('test.js').join('\n') );

Answer 2

I don't think it's possible without some changes to the way you serve your scripts. I believe you need to hard code the host name into some variable your script declares, and change that as your script file moves from dev to test to www . Alternatively, you can insert the value dynamically using eg PHP.

Example: In your script, you'll have something like

var myscript = {
    // declare a 'namespace'
    stage = '__STAGE_PLACEHOLDER__';

    myfunc = function(args) {
        ...

    }

    // your code goes here
};

Before you serve it, have __STAGE_PLACEHOLDER__ replaced by dev / test / www , and then you can introspect using myscript.stage .

Answer 3

If you want the env to depend on the path of the script, not the page which included it, then window.location won't work. What you could do is have a different js script for each env, with a custom getHost() function in it, ie:

var getHost = function () {
  return "dev";
}

To avoid the overhead of having multiple scripts you could generate this additional function on the fly on the server side.

You could also ask the user to define the environment himself, ie:

MyApp.config.env = 'dev';

Answer 4

从Mozilla开发人员网站参考window.location ：

window.location.hostname // the host name (without the port number or square brackets)