如何找出哪个Javascript导致jQuery Ajax请求?
如何从Ajax请求触发的地方findJavascript代码? 在Firebug的控制台中,我们可以识别文件和行号,但是如果我们使用$.ajax
或$.post
或者类似jQuery的函数,它只会在Firebug控制台中loggingjQuery库文件。 有没有办法得到jQuery函数的实际触发点?
在具有Sources
的DevTool中使用Chrome
。
如果你打开这个,你会在右边看到XHR Breakpoints
,如果你选中Any XHR
你的脚本将在每个使用XMLHttpRequest
请求中暂停(所以不要求使用jsonp
的请求)。
如果Any XHR
选项不可用(仅列出No Breakpoints
),那么Break when URL contains:
字段空白并按回车键时,您必须单击+
离开Break when URL contains:
。 这将创buildAny XHR
选项。 (感谢Yasmin French的这个信息)
通过Call Stack
(也在右侧),您将看到请求的来源是什么。
但正如我所提到的,如果你想要追踪这些jsonp
请求,那么你需要使用未缩小版本的jQuery
(或者包含缩小版本的源映射),并在其源代码中的正确部分设置一个断点。 要find这部分你可以使用以下步骤:
- 在你的代码中创build一个
jsonp
请求,并在这个地方设置一个断点。 - 调用你的代码的这部分,以便切换到debugging器。
- 使用
Step into
,现在你应该在jQuery代码中。 如果你现在在那里放置一个断点,Chrome会停止每一个jsonp
请求。
注意:有时Chrome (可能只有beta或dev版本)往往会在重新加载时失去断点,所以您需要检查它们在重新加载时是否仍然存在。
这在早期的Chrome版本中可能不存在,但版本56.0.2924.87有一个“启动器”列,用于通知启动请求的文件中的html / js文件和确切的行。
这个请求可以是XHR,HTTP请求JPG,CSS或其他任何东西。
相当光滑,有助于追溯请求。
以下是如何使用它?
- 按“F12”打开开发者控制台。
- 在每个请求中查找“Initiator”列,可以看到“jquery.min.js:4”,表示请求是从文件“jquery.min.js”的第4行开始的。
在chrome和firefox / firebug中,你可以在.always ()上使用console.trace(),或者在你的ajax调用的beforeSend处理函数上使用console.trace()来查看是谁调用的。