Is it possible to load in a local version of a JavaScript file instead of the server version?

Question

Just had a quick question to throw out and see if there was a solution for this...

Let's pretend I have no access to the server. I load up a webpage and find out that they have a Javascript file loading from a subfolder (let's say /scripts/js/some.js)

Now, I want to make changes to this file locally and test it against the whole site without downloading the entire site to a local folder.

Does anyone know of a way I can override the loading of that remote js file in favor of a local/edited copy of it?

Answer 1

Try using noscript or adblock to block the server side script from loading. Then use greasemonkey to load your own script.

Answer 2

I actually found a solution for this. Posting details for anyone that comes here looking for it.

Privoxy (www.privoxy.org/) [Free] Allows this for the most part through a redirect. Though Firefox may block the redirect depending on where you put it. This means you most likely will not be able to save the file locally and reference it via file://etc/

( I wish I had a way to tell you how to statically fiddle with JavaScript on web pages you have limited access to... but I have not found it. If an answer comes along I will accept it over this. )

Of course, you have to set up Privoxy, and use it as a local proxy server. It's pretty simple if you only use it temporarily: Just point your browser to proxy 127.0.0.1 on port 8118 with it running.

You have to add a redirect "default action" (Options > Edit Default Actions) to redirect the browser to use your new copy:

{ +redirect{/newLocation/some.js} }
 /scripts/js/some.js

Answer 3

If you want a way to use a local file instead of a remote file (in any web browser), I highly recommend Charles Web Proxy. http://www.charlesproxy.com/

In Charles, go to the Tools menu and select Map Local. Add a new mapping by entering the address of the file on the web you would like loaded from your disk.

This technique will for all sorts of files (JavaScript, CSS, SWF). Of course you have the option to temporarily disable this feature, and it will only work while Charles is running. Very handy.

Answer 4

While your solution with proxy is somewhat more permanent, I found that with Fiddler you can do it with almost no configuration:

How to replace Javascript of production website with local Javascript?

Answer 5

In a browser that supports FileReader such as Chrome, yes, in combination with 'eval' to execute arbitrary JS. In your HTML add a button for the user to press:

<form>
    <input type="file" name="file"
        onchange="loadJS(event.target.files);">
</form>

In your scripts add:

function load() {
  var reader = new FileReader();
  reader.onload = function(evt) {
    eval(evt.target.result);
  };
  reader.readAsText(files[0]);
}