javascript - 如何找到触发 ajax 的 javascript 代码？

Question

有什么快速的方法可以找出哪个 javascript 代码（文件名和确切的行）触发了特定的 ajax 调用？

使用 firebug 我可以找到 ajax 调用，但快速找出确切的行将有助于调试

提前感谢您的帮助

Answer 1

在 Firebug 中，您可以单击控制台面板中的源链接：

或者在 Net 面板中设置断点：

Answer 2

如果您在代码中在此 ajax 调用处放置断点，调试器将向您显示函数调用堆栈。

请参阅Chrome 开发人员工具文档：

Answer 3

我真的不知道任何干净的方法（也许存在一种）。但我有一点建议。

如果您没有在网页中使用 Prototype.js，请在命令行中输入以下命令（使用 Firebug 1.11）：

window.old$ = $; // in case you're using a framework like jQuery
include("https://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"); // loads Prototype

控制台应打印：prototype.js 正确包含。

然后，要恢复旧的“$”变量，请键入：

window.$ = window.old$;

现在已经加载了 Prototype，我们可以包装 XMLHttpRequest.prototype.open 函数，这样我们就可以获得调用堆栈（就像建议的 dystroy 一样）：

XMLHttpRequest.prototype.open = XMLHttpRequest.prototype.open.wrap(function(orig, ...args)
{
    console.log("trace for :"+args[1]); // prints the URL of the request
    console.trace(); // prints the stack trace
    orig.apply(null, args); // call the original function
});

就是这样。

注意：如果请求在开始时启动：

• 在“脚本”面板中，在网页的第一条 JS 指令上设置断点
• 在控制台面板中执行上面的命令
• 返回脚本面板，然后单击继续

Answer 4

我通常做的是添加一堆：

console.log("message that explains where in the code I am now...");

但请注意，因为console.log 可能会在旧版本的IE 中产生问题，所以您必须在投入生产时删除所有console.log 调用。