javascript - Chrome 在调试 AJAX 时仅显示调用堆栈中的库行

Question

我已设置“XHR 断点”以在“任何 XHR”上中断以查找哪一行触发 AJAX 请求，但是当我检查调用堆栈时 - 所有行都是 Angular.js 库行。这是没有意义的，因为这样我就找不到代码中的哪一行触发了请求。我应该怎么办？

更多信息:

如果这很重要，则 AJAX 响应是错误的，因为它请求不存在的 URL。
另外，当我黑盒 Angular 时 - 断点不会触发。

Answer 1

Angular 不会立即发出 Ajax 请求。相反，它会将其排队直到摘要完成。

您可以通过拦截$http.get来找到引发请求的代码。方法，或任何您用来发出请求的内容。

debugCall($http, "get"); // put this somewhere where it's only called once

function debugCall(object, methodName){
    var originalMethod = object[methodName];
    object[methodName] = function(){
         debugger;
         originalMethod.apply(this, arguments)
    }
}

您还可以查看 Angular 调用堆栈并尝试在那里获取提示。例如，在this demo中调用堆栈中的第一个函数被称为 eventHandler .

如果您转到该调用框架并运行 event.target.outerHTML在控制台中你会得到 <button ng-click="doXhr()">Do XHR 2</button> 。这可以让您很好地了解在哪里查找请求。