如何找出哪个Javascript导致jQuery Ajax请求？

Question

如何从Ajax请求触发的地方找到Javascript代码？在Firebug的控制台中，我们能够识别文件和行号，但如果我们使用$.ajax或$.post或jQuery的某些类似功能，它只会在Firebug的控制台中记录jQuery库文件。有没有办法获得jQuery函数的实际触发点？

Answer 1

在{em> DevTool 中使用Chrome Sources。

如果你打开它，你会看到右侧XHR/fetch Breakpoints，如果你检查Any XHR你的脚本会在每次使用XMLHttpRequest的请求时暂停（所以请求不使用请求jsonp。

如果Any XHR选项不可用（仅列出No Breakpoints），则必须点击+将Break when URL contains:字段留空并按Enter键。这将创建Any XHR选项。 （感谢Yasmin French获取此信息）

使用Call Stack（也在右侧），您将看到请求的来源是什么。

但正如我所提到的那样，如果你想追踪这些请求，这不会中断jsonp请求你需要使用jQuery的非缩小版本（或包含缩小版本的源图）并设置在正确的部分来源的断点。要查找此部分，您可以使用以下步骤：

1. 在代码中创建jsonp请求，并在此处设置断点。
2. 调用代码的这一部分，以便切换到调试器。
3. 使用Step into，现在您应该使用jQuery代码。如果您现在在那里放置一个断点，Chrome将针对每个jsonp请求停止。

注意：有时 Chrome （可能只在 beta 或 dev 版本中）往往会在重新加载时丢失断点，因此您需要检查重装时是否仍然存在。

Answer 2

这可能不存在于早期的Chrome版本中，但版本56.0.2924.87有一个“启动器”列，告诉html / js文件以及该文件中发起请求的确切行。

此请求可以是XHR，http请求jpg，css或其他任何内容。

非常时尚且有助于追溯请求。

以下是如何使用它？

1. 按“F12”打开开发者控制台。
2. 在每个请求中查找“Initiator”列，您可以看到“jquery.min.js：4”，这意味着请求是从文件“jquery.min.js”的第4行开始的。

Answer 3

在chrome和firefox / firebug中，您可以在.always()上使用console.trace（），也可以在ajax调用的beforeSend处理程序中使用它来查看谁调用它。