ChatGPT解决这个技术问题 Extra ChatGPT

在 Chrome 中请求监控

在 Firefox 中,我使用 Firebug,它允许我查看我的 ajax 调用发出的每个 http 请求。我已经将我的开发切换到 Chrome 并且到目前为止我很喜欢它。然而,我唯一的抱怨是开发人员工具似乎不允许您查看每个 ajax 请求。我曾经在资源面板显示对同一资源的多个请求时发生过这种情况,但它只完成了一次,而且再也没有发生过。

有没有办法可靠地查看页面在 Chrome 中通过 javascript 发出的每个 http 请求?

[编辑:11/30/09 11:55]

目前,为了解决这个问题,我在 Chrome 旁边运行 Fiddler 来查看我的请求,但如果有办法从浏览器中执行此操作,我更喜欢这样做。

我有同样的问题 - 在这里尝试了所有解决方案。开发工具中 XHR 窗口的响应部分中没有显示任何内容。它只显示“此请求没有可用的响应数据”。如果我使用 firebug 运行相同的代码,它会显示得很好。在 cog 开发工具设置中,我尝试勾选“Log XMLHttpRequest”,但这没有帮助(响应类型是 application/json)。我必须在 firebug 中进行所有调试。 Firebug 还可以很好地格式化 JSON,如果您可以让它显示响应(例如不使用 ajax),chrome 开发工具不会。

m
maheshwaghmare

我知道这是一个旧线程,但我想我会插话。

Chrome 目前有一个内置的解决方案。

使用 CTRL+SHIFT+I(或导航到当前页面控制 > 开发人员 > 开发人员工具。在较新版本的 Chrome 中,单击扳手图标 > 工具 > 开发人员工具。)启用开发人员工具。在开发人员工具中单击网络按钮。如果还没有,请为会话启用它或始终启用它。单击“XHR”子按钮。发起 AJAX 调用。您将看到项目开始显示在“资源”下的左栏中。单击资源,有 2 个选项卡显示标题和返回内容。


谢谢菲尔!我已经把它放在一边,主要依赖 Fiddler。但是那个 XHR 按钮正是我想要的:D
就在昨天,我在说如果 chrome 工具可以做到这一点,那将是完美的,谢谢。
大家好,试图找到“XHR 子按钮”,我想我可能会错过它,有人能告诉我那在哪里吗?这就是我的检查员的样子 imgur.com/9e6yDcB
这似乎只有在 AJAX 调用得到响应时才会发生,但它不会向您显示可能不期望响应的传出请求。有人知道如何启用它吗?
如果页面重定向到同一窗口,您可以使用网络选项卡选项顶部的“保留日志”复选框(如果不是,您可以通过设置 target='_self' 将该链接更改为在同一窗口中打开)。然后,例如,您可以看到在重定向您后提交的表单的响应。当响应在新页面加载时堆积起来时,请务必注意过滤器。
W
Wouter

对此的最新答案是:它们列在开发人员工具的“网络”按钮下,不再像以前那样在“资源”下。


那确实是现在的位置,升级后带我搜索堆栈溢出以找到它。
K
Karl Adler

更新

Chrome 更改了检查请求的方式并建议现在将 Catapult Netlog Viewer 与从 chrome://net-export/ 导出的日志一起使用

chrome://net-export/

More Info

旧 Chrome 版本

您也可以在 Chrome 中使用此链接获取比检查员所做的更详细的信息。

chrome://net-internals/#events

这显示了打开时浏览器的所有请求的日志


你能出口那个吗?
s
schellmax

不知道哪个 chrome 版本可用,但我找到了一个设置“控制台 - 记录 XMLHttpRequests”(在 Mac 上的 chrome 中单击开发人员工具右下角的图标)


这是监控 XHR 请求的最简单和最好的方法。
S
ShaneDaugherty

打开您的 DevTools 并按 F1 访问设置。查找控制台部分并选中“Log XMLHttpRequests”复选框。

现在,您的所有 ajax 和其他类似请求都将记录在控制台中。

我更喜欢这种方法,因为它通常允许我在控制台中查看我正在寻找的所有内容,而无需转到网络选项卡。


J
JoshBerke

您可以使用 Fiddler,这是一个很好的免费工具。


是的,我有 Fiddler,这是我用来做这件事的。只是在浏览器中寻找一种方法,因为它更方便一些。
m
masoud2011

感谢所有试图在这篇文章中提供帮助的人

我有 ubuntu 13.10,我的 chrome 版本是 34.0

对于我的情况,这有效

1.open developer tools in chrome(or use right click on your page and then select inspect element)
2.go to "Network" tab
3.find your ajax request in "Name Path" column 
4.click on the specific ajax link

现在您应该在您的请求面前看到一个新面板

in this panel select "Response" tab

w
wcb1

在 Phil 的第 5 步中,“资源”在新版 Chrome 中不再可用。您需要单击底部窗格中列出的 Ajax 页面旁边的页面图标,其中包含名称、方法、状态等列。

然后它将向您显示更多面板,您可以在其中找到错误消息。


B
BitByteDog

您也可以在浏览器中右键单击页面并选择“检查元素”以调出开发人员工具。

https://developer.chrome.com/devtools