我怎么能过滤只有谷歌浏览器网络devtools错误的请求?
fjnneemd1#
您可以按状态代码过滤响应-Here's a useful list和所有HTTP的状态代码。AFAIK这个过滤功能已经使用了很多年了,它是通过status-code属性实现的(你可以在Google Developers中看到所有可以使用的属性)。正如所解释的:status-code。仅显示HTTP状态代码与指定代码匹配的资源。DevTools将使用遇到的所有状态代码填充自动完成下拉菜单。虽然它不如正则表达式或通配符有用,但它可以缩小很多范围,例如,如果您想查看所有带有错误403的请求,则过滤器为status-code:403。有一个有用的情节转折:您可以使用负过滤器,即:-status-code:200(注意前面的-符号),这将 * 过滤掉 * 所有代码为200的请求,只显示大多数有问题的请求。
status-code
status-code:403
-status-code:200
-
所有的200的出路,您可以排序的状态列,以获得更好的体验。
要进行更深入的分析(几乎同样快速),您可以轻松地将整个网络日志及其详细信息导出到HAR(HTTPARchive)文件。
将其粘贴到自己喜欢的编辑器中,你会看到它只是一个JSON文件(纯文本),你随时可以搜索“error”或者RegExp表达式,如果你懂一点JS、Python等,你就可以按照自己的意愿快速解析它。或者,您可以将其保存为*.har文件,例如,并使用HAR分析器,如Google's free analyzer:
*.har
有一个lotof tools可以帮助你分析HAR文件。像Paw、Charles和其他应用程序可以导入HAR,并将其作为请求历史显示给你。据我所知,Postman还不了解HAR,但你可以转到网络选项卡,以cURL格式复制而不是HAR(或使用HAR-〉cURL转换器,如this one),并将其直接导入Postman。
gxwragnw2#
没有这样的功能。Filter输入不适用于Status列。您可以通过在过滤器栏中添加复选框来增强devtools本身:1.打开网络面板1.将devtools移到一个单独的窗口1.按热键调用devtools - CtrlShifti或i1.粘贴下面的代码到这个新的devtools窗口控制台并运行它
Filter
Status
{ // see the link in the notes below for a full list of request properties const CONDITION = r => r.failed || r.statusCode >= 400; const label = document.createElement('label'); const input = label.appendChild(document.createElement('input')); input.type = 'checkbox'; input.onchange = () => { const view = UI.panels.network._networkLogView; view.removeAllNodeHighlights() view._filters = input.checked ? [CONDITION] : []; view._filterRequests(); }; label.append('failed'); UI.panels.network._filterBar._filters[1]._filterElement.appendChild(label); }
resources.pak
2条答案
按热度按时间fjnneemd1#
选项1:过滤HTTP状态代码
您可以按状态代码过滤响应-Here's a useful list和所有HTTP的状态代码。
AFAIK这个过滤功能已经使用了很多年了,它是通过
status-code
属性实现的(你可以在Google Developers中看到所有可以使用的属性)。正如所解释的:
status-code
。仅显示HTTP状态代码与指定代码匹配的资源。DevTools将使用遇到的所有状态代码填充自动完成下拉菜单。虽然它不如正则表达式或通配符有用,但它可以缩小很多范围,例如,如果您想查看所有带有错误403的请求,则过滤器为
status-code:403
。有一个有用的情节转折:您可以使用负过滤器,即:
-status-code:200
(注意前面的-
符号),这将 * 过滤掉 * 所有代码为200的请求,只显示大多数有问题的请求。所有的200的出路,您可以排序的状态列,以获得更好的体验。
选项2:使用HAR格式
要进行更深入的分析(几乎同样快速),您可以轻松地将整个网络日志及其详细信息导出到HAR(HTTPARchive)文件。
将其粘贴到自己喜欢的编辑器中,你会看到它只是一个JSON文件(纯文本),你随时可以搜索“error”或者RegExp表达式,如果你懂一点JS、Python等,你就可以按照自己的意愿快速解析它。
或者,您可以将其保存为
*.har
文件,例如,并使用HAR分析器,如Google's free analyzer:有一个lotof tools可以帮助你分析HAR文件。像Paw、Charles和其他应用程序可以导入HAR,并将其作为请求历史显示给你。据我所知,Postman还不了解HAR,但你可以转到网络选项卡,以cURL格式复制而不是HAR(或使用HAR-〉cURL转换器,如this one),并将其直接导入Postman。
gxwragnw2#
没有这样的功能。
Filter
输入不适用于Status
列。您可以通过在过滤器栏中添加复选框来增强devtools本身:
1.打开网络面板
1.将devtools移到一个单独的窗口
1.按热键调用devtools - CtrlShifti或i
1.粘贴下面的代码到这个新的devtools窗口控制台并运行它
resources.pak
文件并不难,有几个工具可以反编译/构建该文件。