Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Load remote JavaScript files via the address bar

Is it possible to load remote JavaScript files from the address bar?

I have been trying to put this into the address bar:

javascript:src='http://depot.com/file.js';funcname();

I'm not using this for bad things. I'm just testing my site, that's all. If you wanted to protect your site you must learn to attack it first, right?

like image 989
kapitanluffy Avatar asked Sep 18 '10 14:09

kapitanluffy


People also ask

How do I load an external JavaScript file?

To include an external JavaScript file, we can use the script tag with the attribute src . You've already used the src attribute when using images. The value for the src attribute should be the path to your JavaScript file. This script tag should be included between the <head> tags in your HTML document.

Where do I load JS files?

The <script> tag can be placed in the <head> section of your HTML or in the <body> section, depending on when you want the JavaScript to load. Generally, JavaScript code can go inside of the document <head> section in order to keep them contained and out of the main content of your HTML document.


2 Answers

I guess you should be able to do the following:

javascript:(function () {
  var newScript = document.createElement('script');
  newScript.type = 'text/javascript';
  newScript.src = 'http://depot.com/file.js';
  document.getElementsByTagName('body')[0].appendChild(newScript);
})();

Here's a very useful example (paste this in your address bar):

javascript:(function () {
  var newScript = document.createElement('script');
  newScript.type = 'text/javascript';
  newScript.src = 'http://cornify.com/js/cornify.js';
  document.getElementsByTagName('body')[0].appendChild(newScript);

  for (var i = 0; i < 5; i++) {
    newScript = document.createElement('script');
    newScript.type = 'text/javascript';
    newScript.src = 'http://cornify.com/js/cornify_run.js';
    document.getElementsByTagName('body')[0].appendChild(newScript);
  }
})();

Voila:

Stack Overflow cornified

In fact, this is how cornify.com is including the remote scripts in their bookmarklet.


UPDATE:

As @Ben noted in the other answer, it's not that straightforward to call a function defined in your remote script. Ben suggests one solution to this problem, but there is also another solution, the one that cornify are using. If you check out http://cornify.com/js/cornify_run.js you'll see that there's just one function call in that file. You could place your funcname() call in a separate JavaScript file, as cornify are doing, because script blocks are guaranteed to be executed in the order they are inserted. Then you'd have to include both scripts, as in the following example:

javascript:(function () {
  var newScript = document.createElement('script');
  newScript.type = 'text/javascript';
  newScript.src = 'http://depot.com/file.js';
  document.getElementsByTagName('body')[0].appendChild(newScript);

  newScript = document.createElement('script');
  newScript.type = 'text/javascript';
  newScript.src = 'http://depot.com/file_run.js';
  document.getElementsByTagName('body')[0].appendChild(newScript);
})();

Where the file_run.js simply includes a call to funcname().

like image 116
Daniel Vassallo Avatar answered Sep 17 '22 20:09

Daniel Vassallo


Not directly an answer, but helpful nonetheless.

Here is a script to load in a javascript file when used in a bookmark:

javascript:var%20e=document.createElement('script');e.setAttribute('language','javascript');e.setAttribute('src','http://github.com/balupton/ajaxy-bookmark/raw/master/script.js');document.body.appendChild(e);void(0);
like image 36
balupton Avatar answered Sep 20 '22 20:09

balupton