如何在 Chrome 的网络标签页中搜索所有的 ajax 响应？

我想这样做是因为 JavaScript 开发人员很难知道哪些信息来自哪个服务调用，特别是如果您是项目的新手，而且业务逻辑不清楚。此外，在网络选项卡中打开每个服务并搜索如此多的服务调用的响应是困难和耗时的。

google-chrome-devtools

37866 次浏览

小开

This is similar to another question this morning to search json responses. The solution is the same, star ~~this issue~~ this issue. Starring is triggered via the star icon in the far left area of the blue title are just under search.

Starring issues let's the developers know what people need. The more stars something has, the more likely it is to get worked on sooner.

Currently this functionality is not provided and extensions are unable to add this type of functionality since the network panel isn't extensible in this way.

小开

There doesn't seem to be a way to do this in Chrome or Firefox. My solution has been to use Fiddler, which does support it.

小开

Inspector of Microsoft Edge browser offer such feature. Useful when you need to search through traffic made by an HTTPS web site that Fiddler cannot inspect (like Facebook web site).

小开

In Firefox you can save all the responses as a HAR file and then search through the file in a text editor (Chrome truncates the responses).

小开

最佳答案

This has now been implemented on the Network tab. Whenever a search criteria is added, Chrome will offer searching through all headers and bodies.

More from offical doc,

Open the Network panel then press Command+F (Mac) or Control+F (Windows, Linux, Chrome OS) to open the new Network Search pane.

小开

Edit: I believe this was working for all resources at the time of writing, but please see comments because people say it is not/no-longer working as expected.

As of Chrome version 91, if you want to search through all resources (not just AJAX/fetched resources), then you need to open DevTools and then press Ctrl+Shift+F to open a search box. If you just type into the "filter" text input then it only searches through the URLs, rather than also searching the contents.