问题
Is it possible to filter out some requests using Chrome developer tools, say, filter out all image requests?
回答1:
There isn't a very flexible filtering feature, but the bar at the bottom does allow you to only show requests of a certain document or connection type:
You can't just exclude images, but it should help.
You can also press Control/Command+F to search for a particular string in the request list, and check the "filter" box to hide requests that don't match:
回答2:
Negative text filters - list results not matching a given query.
- Use -.png or -.gif or -.jpg as filter in the network panel.
- Many other negative filters work too. e.g. -mime-type:image/png, -larger-than:20k, -domain:yoursite.com, -status-code:404. See Chrome developer docs - Sorting and filtering.
Available since Chrome ~42 - Issue Link, announced here
Another approach: In the Network panel open the filter and CTRL/CMD-click the types of requests you want to show. To hide just image requests then select all the other types except images while holding CTRL/CMD.
回答3:
You write -.png -.gif -.jp in the filter input box to exclude all images from the results. At the bottom it shows the total amount of data transferred without images.
An "Engineer at Google working on Chrome" twittered in Dec'14:
Chrome DevTools: Negative text filters just landed in the Network panel. List results not matching a given query Twitter Link
edit: you can even filter by domain, mime-type, filesize, ... or exclude by entering -domain:cdn.sstatic.net and combine any of these mime-type:image/png -larger-than:100K to show only png files smaller than 100kb in network panel
see DevTools: State Of The Union 2015 by Addy Osmani
Since Chrome 42.
回答4:
Under my build of Google Chrome (Version 74.0.3729.157 (64-bit)), I've found the following filters available (I've added some examples). Note that DevTools has an AutoComplete functionality (which helps a lot in sorting this stuff out).
domain:
-domain:
# Use a * character to include multiple domains.
# Ex: *.com, domain:google.com, -domain:bing.com
has-response-header:
-has-response-header:
# Filter resources with the specified HTTP response header.
# Ex: has-response-header:Content-Type, has-response-header:age
is:
-is:
# is:running finds WebSocket resources
# I've also come across:
# - is:from-cache,
# - is:service-worker-initiated
# - is:service-worker-intercepted
larger-than:
-larger-than:
# Note: larger-than:1000 is equivalent to larger-than:1k
# Ex: larger-than:420, larger-than:4k, larger-than:100M
method:
-method:
# method:POST, -method:OPTIONS, method:PUT, method:GET
mime-type:
-mime-type:
# Ex: mime-type:application/manifest+json, mimetype:image/x-icon
mixed-content:
-mixed-content:
# 2 that I've found documented:
# mixed-content:all (Show all mixed-content resources)
# mixed-content:displayed (Show only those currently displayed) (never used this personally)
scheme:
-scheme:
# Ex: scheme:http, scheme:https,
# Note that there are also scheme:chrome-extension, scheme:data
set-cookie-domain:
-set-cookie-domain:
#
# Ex: set-cookie-domain:.google.com
set-cookie-name:
-set-cookie-name:
# Match Set-Cookie response headers with name
# Ex: set-cookie-name:WHATUP
set-cookie-value:
-set-cookie-value:
# Match Set-Cookie response headers with value
# Ex: set-cookie-value:AISJHD98ashfa93q2rj_94w-asd-yolololo
status-code:
-status-code:
# Match HTTP status code
# Ex: status-code:200, -status-code:302
回答5:
Like -MimeType you can use domain in filter input, like this:
domain:yourdomain.com
回答6:
If you open the developer tools, choose network. From the bar at the bottom of the page, choose images if you want to look specifically for image requests. The filters are all exclusive, so you can not filter out just image requests. There you go.
回答7:
Adding a -MimeType:image/jpeg filter worked for me.
来源：https://stackoverflow.com/questions/14637278/is-there-a-way-to-filter-network-requests-using-google-chrome-developer-tools