Modify HTTP response in Chrome extension

Question

Is it possible to create a Chrome extension that can modify the HTTP response body?

I've looked at the Chrome extension API and found nothing that would implement this functionality.

Answer 1

I just released a Devtools extension that does just that :)

It's called tamper, based on mitmproxy, and it allows you to view all requests made by the current tab, modify them, and serve the modified version on the next refresh.

This is a fairly early version, but should be compatible with OS X and Windows. If it doesn't work for you, please let me know.

You can get it here: http://dutzi.github.io/tamper/

working principle

As @Xan's comment below says, the extension communicates via native messaging with a Python script that extends mitmproxy.

The extension uses chrome.devtools.network.onRequestFinished to list all requests.

When you hit one of the requests, it downloads its response using the request object's getContent() method, and then sends that response to a Python script saved locally.

It then opens the file in the editor using call (for OSX) or subprocess.Popen (for Windows).

The Python script uses mitmproxy to listen to all communication going through the proxy and if it detects a request for a saved file it will serve the saved file.

I used Chrome's proxy API (specifically chrome.proxy.settings.set()) to set the PAC to the proxy settings. This PAC file redirects all traffic to the Python script’s proxy.

The best thing about mitmproxy is that it can also modify HTTPS communication. So you can use it too :)

Answer 2

In general, you cannot change the response body of an HTTP request using the standard Chrome extension API.

This feature is being requested on 104058: WebRequest API: Allow extended editing of the response body . Bookmark this question to get notified of updates.

If you want to edit the response body of a known XMLHttpRequest, please inject code through the content script to override the default XMLHttpRequest constructor, using a custom Define a (fully functional) constructor that overrides the response body before firing the real event. Make sure your XMLHttpRequest object is fully compatible with Chrome's built-in XMLHttpRequest object, otherwise it will cause problems with AJAX-heavy websites.

In other cases, you can use the chrome.webRequest or chrome.declarativeWebRequest API to redirect the request to data:-URI. Unlike the XHR approach, you won't be able to get the content of the original request. In fact, the request never reaches the server because the redirect can only be completed before the actual request is sent. If you redirect a main_frame request, the user will see the data:-URI instead of the requested URL.