Search code examples
javascriptdebuggingwebbrowserbrowser-plugin

Trick a browser into loading <script> or <link rel="stylesheet"> URLs from local setup/server?


I'm debugging a CSS/JS problem on a live website, and in this situation it is unfeasible to clone the entire production system onto a local machine to fiddle with 2 lines of code.

I would LOVE it if there were a simple way to trick a browser (FF, Chrome, anything - I'm not fussy) into loading the live site but redirecting certain internal URLs to a local webserver. Any ideas?

eg. I want to load the entire live website, except one specific Javascript file. The attempt to access http://...production.../js/map.js should be rerouted to http://localhost/debug/js/map.js, which I can edit locally until the problem is fixed.


Solution

  • I have found a Chrome extension which, despite its bugs, achieves precisely this behaviour. DevTools Redirect: https://chrome.google.com/webstore/detail/devtools-redirect/jmhdebkkippcccflcoddckhjjfgnfhnp

    This allows developers to specify JS or CSS files to redirect, and a new URL to grab them from (eg. http://localhost/.../debug.js).