How to block a URL in Chrome's developer tools network monitor

Question

I am currently analysing my page connections and I want to block some tracking scripts and other external URL calls in my network monitor inside Chrome\'s developer tools.

Answer 1

Well, i have been looking for an answer for this too, as I had this issue of choices by counterfeit, and nothing seemed to work for me. But then I tried to analyze the requests and other things until I figured out, that there was this site which was loading ads onto my pages and redirecting me to advertisements. And also changing the google search bar on new tabs to some unknown search engine. I was able to temporarily block the request on one page. but after opening a new tab, the ads would appear again.

So googling for request blocker, I came up with a chrome extension "HTTP Request Blocker" and added the address which was causing all the crazy ads, has now solved the problem fully.

I hope it will be of help to you too or anyone else.

Answer 2

For blocking requests in google chrome you have 3 options:

1. Google Chrome with pattern matching:

In network tab, right click on request and then select block request URL

There is a plus sign that adds patterns for blocking requests

For example I have 7 request URLs:

1. http://www.test.com?userid=5
2. http://www.test.com?username=username
3. http://www.test.com?email=email
4. http://www.test.com?name=x
5. http://www.test.com?family=q
6. http://www.test.com?family=y
7. http://www.test.com?family=z

I can block requests that have a specific pattern by adding a pattern(for example the pattern *family* blocks 3 below requests):

1. http://www.test.com?family=q
2. http://www.test.com?family=y
3. http://www.test.com?family=z

Be careful! Because patterns are case sensitive

2. HTTP Request Blocker extension:

This extension has pattern matching for blocking requests:

Match patterns

3. Request blocker extension:

This is a useful extension that has pattern matching for blocking requests.

The most useful features of this request blocker are importing and exporting lists for using by other People.

For exporting a list and using in another computer(or future used): click on Direction down and select Export.

Open the exported list with import list button.

Good Luck

Answer 3

From Chrome 59 you can block specific requests from Network tab of developer tools itself.

https://developers.google.com/web/updates/2017/04/devtools-release-notes#block-requests

Right-click on the request in the Network panel and select Block Request URL. A new Request blocking tab pops up in the Drawer, which lets you manage blocked requests.

Answer 4

An existing bug report is requesting this feature. You can star that issue to show support for it being added.

Answer 5

Will changing host file help. Your system (windows, linux, mac) all check host before requesting DNS lookup. I use it when I wan tot block some slow advertisers.

windows: c:\Windows\system32\drivers\etc\hosts

linux & mac /etc/hosts

* BE VERY CAREFUL TO MAKE BACK UPS *

Answer 6

As abd3721 mentioned this is available directly within chrome DevTools (You don't need to be on canary anymore), however it is still behind a flag and in the hidden experimental features menu. As of the time of this comment, Chrome stable is on version 53.

To enable it, open this link and click the enable link under the appropriate flag: chrome://flags/#enable-devtools-experiments

Then in DevTools open up the settings panel(F1) and click on the experiments tab.

This lists all currently available DevTools experiments but it is still in yet another hidden set of features.

Press Shift 6 times while in the experiments tab to show even more hidden features, one of them will be Request Blocking.

NOTE: These features are considered experimental and may be buggy or incomplete. Use with caution.