Chrome 开发者工具未捕获 AJAX 请求答案

【问题标题】：AJAX requests not captured by Chrome Developer ToolsChrome 开发者工具未捕获 AJAX 请求
【发布时间】：2012-07-31 00:31:48
【问题描述】：

在 Facebook 的个人资料页面上观察 Chrome 开发者工具的 Network 选项卡时，我注意到几乎没有捕获任何 XHR 请求。在个人资料页面周围单击，例如单击链接以查看个人资料的照片，表明没有发出 AJAX 请求，但该站点似乎像单页应用程序一样保持在同一页面上，并且行为非常类似于 AJAX。

Facebook 个人资料页面真的使用像 jQuery 的 $.get() 这样的 AJAX 请求吗？如果是这样，为什么它们不出现在开发人员工具中。如果没有，我怎样才能达到同样的效果？

【问题讨论】：

他们可能使用JSONP
在 Chrome 中，我观察到各种主动（我正在做某事，点击按钮）和被动（定期请求新信息）的流量。尝试打开 XMLHttpRequests 的控制台日志记录（开发人员工具窗口的右下角，然后在控制台下）。然后观察“网络”选项卡和控制台，看看是否有所不同。

标签： javascript jquery ajax backbone.js

【解决方案1】：

过去我自己也被这个咬过。查看网络选项卡时，您可以过滤掉您希望开发人员工具显示的请求类型。默认选择“全部”。但是，如果您不小心点击了“JS”、“CSS”等，则只会显示这些请求。

点击“全部”即可解决您的问题。

【讨论】：

无论如何我打赌不 :) - 欢迎来到 Stack Overflow - 很高兴有你。
天啊，我在过滤器栏中选择了“Doc”，但我从来没有注意到！！！谢谢，我已经有这个问题好几个星期了，哈哈。

【解决方案2】：

当然，您可以捕获 JSONP 请求。 JSON-P 只不过是普通的 JSON 数据，但包装在一个 JavaScript 函数中。响应将如下所示：

jQuery17206302290489639558_1343824008197([{"
Chrome 开发者工具中可能没有显示可能是因为使用了 HTTPS。

顺便说一句，如果您有兴趣或者正在探索如何与 Facebook API 交互，那么市面上有很多（免费）在线工具。 Apigee 的 Facebook 控制台非常好：https://apigee.com/console/facebook

【讨论】：