Pavel Pavel - 1 year ago 58
HTTP Question

modifying 3rd party website locally for testing

What's the general approach on modifying 3rd party websites for testing? For example, I want to modify certain aspects of a random website (HTML, js, css, images whatever) that I do not control and see locally modified site with my changes.
There are multiple ways:
1. copy everything to local server and do whatever I want.
This is a bit tedious, messy and won't replicate exact behavior of original server: some headers might not be the same (CORS for example). Also, host name is different (but this can be "fixed" by overriding host name in

2. Another approach is to create a chrome extension that does what I want: there are hooks for chrome.webRequest where I can redirect to another file (on other server or stored in the extension folder). This also doesn't work for me: when I redirect somewhere else I get CORS issues because redirected file is located elsewhere.

My goal is to get absolutely identical behavior (e.g. it's best to access the site in question directly, and not its copy on my local server) but before content is rendered have a chance to modify it. I could for example setup a local proxy and would make my changes on the fly, but the remote site uses https, so I cannot do it that way.
If I had a chance to run regex.replace on received content buffer that would be perfect. Any ideas how to do something like that?

Answer Source

A third party site will typically be published via a build process that minifies and bundles together JavaScript and CSS (e.g. closure, jspm, webpack, browserify), and sometimes images as well (as sprites). If you don't have the source files, you can still resort to the methods below.

If you want to modify the CSS and have it persist, you can use a Chrome extension like Live CSS editor.

For JavaScript, Chrome supports user scripts, and you can manage user scripts more easily with Tampermonkey.

A proxy to do regex replacements is another valid approach - see Proxomitron for Windows, which also has plugins that can intercept SSL traffic.

EDIT: There are also other proxomitron-like solutions available: Charles or Fiddler as suggested in another unrelated post.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download