How-to · Developer
How to redirect a URL or script to localhost with a Chrome redirect extension
The short answer
Add a rule with the Redirect action: match the production URL with a pattern, set the destination to your localhost address, and the browser loads your local file or API instead — on the live site, with no server or proxy changes.
- 1
Start your local server so the replacement file or API is actually being served.
- 2
Add a rule with the Redirect action.
- 3
Match the production URL with a pattern, or Regex for hashed filenames.
- 4
Set the destination to your localhost URL and save.
- 5
Reload the page and confirm the swap in the hit log and badge count.
- 6
Keep localhost rules in their own group so you can disable them all when you're done.
You've found a bug in a script on the live site and want to test your fix against the real page — without waiting for a deploy. Or your front-end is in production but the API change you're building only runs on your machine. A redirect rule solves both: the browser swaps the production URL for your localhost one at request time, so the live page runs your local code.
Start your local server
Serve the replacement first — localhost:3000 with your rebuilt bundle, or your dev API. A redirect rule only changes where the browser asks; if nothing answers there, you'll just see a failed request.
Add a redirect rule
Create a rule with the Redirect action and match the production URL: ||cdn.example.com/app.js for a fixed path, or Regex when the filename carries a build hash (app\.[a-f0-9]+\.js).
Point it at localhost
Set the destination to your local URL, e.g. http://localhost:3000/app.js. Chrome treats localhost as a secure context, so an https page is allowed to load it — that exception is specific to localhost, not http hosts in general.
Reload and verify
Reload the page. The hit log lists every request the rule rewrote and the badge counts hits — the honest proof, because a swapped request is easy to misread in DevTools. Confirm your local change actually shows up on the page.
Keep it scoped
Put localhost redirects in a per-project group so you can switch the whole set off when you're done — a forgotten redirect rule is a classic "why is prod broken only for me" afternoon. If you're migrating, the importer maps existing Requestly or ModHeader redirect rules over and flags anything unsupported.
Honest limits
A redirect doesn't bypass the browser's security model: if the page fetches your localhost API cross-origin, your dev server still has to send CORS headers (script and image tags are generally unaffected). And on Chrome, fetch/XHR is covered by default, while redirecting top-level navigations needs Full Mode — which shows a visible debugging banner while active. Rules are stored locally with zero telemetry, and redirect rules are unlimited in the free tier.