Is there a way to modify an HTTP request in Chrome or Firefox?

Question

Is there a way to modify an HTTP request using Chrome dev tools or Firebug? For example when developing locally and testing in Chrome, I have a page that needs an HTTP request to fill some data. Because it's local, that service isn't available.

Currently the only way of getting around the problem is configuring a proxy pass in Apache so it hits a QA environment for that call. I'm looking or a simpler way to achieve this because I use Jetty to test the app and can't configure a proxy pass (or that I know of).

In other words, is there a way to create a temporary proxy pass for the current session when testing an app locally?

Spindling

You can try Requestly for modifying HTTP requests in Chrome. It allows you to Rewrite urls, block websites, modify headers etc.. – Ludwig

Firefox as of 2018 can do it with its builtin Developer Tools (press F12 to activate it). – Bravissimo

Does this answer your question? Edit and replay XHR chrome/firefox etc? – Orthographize

Answer 1

This might help in some cases - use fetch command to send another, tampered, request. here's how to do it in Chrome:

1. open DevTools, tab Network
2. clear
3. create your request normally
4. right click that request and select Copy > Copy as fetch
5. go to Console tab and paste
6. tamper the data and hit Enter

Willyt

The request that I'm making results in a file download. When I do this (paste the fetch in the console), the request appears to be successful, but it doesn't trigger a file download in the browser. Is there a way to save the resulting file? – Boneyard

Answer 2

You can use tweak chrome extension and you'll be able to do exactly that, intercept and modify HTTP requests.

Kidwell

This item is 404 now – Riane

chrome.google.com/webstore/detail/tweak-mock-api-calls/… – Speculate

This could be the accepted answer. I just successfully used this tweak extension and it was very easy. 5 mins from install to first intercepted request. – Terce

You now have to pay to intercept requests with that extension. The free version just allows mocking requests, which is kinda useless as you can already do that with devtools. – Verbalize

Answer 3

I am not sure if this solves your specific problem, but you can use Chrome Overrides to override file contents and response headers for web requests. This documentation https://developer.chrome.com/docs/devtools/overrides/ has been very handy for me when I want to modify a request in a remote environment.

Cavort

Unfortunately this way works only for GET requests without query param handling – Tenor

Answer 4

I don't know a way to directly intercept and modify all requests in Chrome or Firefox, but for that I am intercepting the requests either at the application level or the network level when debugging if chrome local overwrites are not enough.

At the application level there is the service worker witch via the fetch api can intercept and modify any request the page is making. https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers

At the network level my go to free app is mitmproxy https://mitmproxy.org/. A man in the middle proxy server that allows to intercept, modify and mock any http request of a device.

Receiptor