瞥见没有捕获 ajax 调用答案

【问题标题】：Glimpse not capturing ajax calls瞥见没有捕获 ajax 调用
【发布时间】：2014-09-02 19:11:11
【问题描述】：

我有一个 ASP.NET MVC5 单页 Web 应用程序，它使用 angularjs 对 ASP.NET Web API 2 应用程序进行 ajax 调用，所有这些都在 Chrome 开发人员工具的“网络”选项卡中可见。但是，Glimpse 不会捕获 ajax 调用，无论是在 HUD 中还是在 Ajax 选项卡中。我已将 application/json 添加到 web.config 中的 glimpse 内容类型。我还在我的 angularjs ajax 调用中添加了 X-Requested-With 标头：

$httpProvider.defaults.headers.common = { 'X-Requested-With': 'XMLHttpRequest' };

然而，HUD 一直显示 0 个 ajax 请求，并且 Ajax 选项卡中没有任何内容。还有什么我应该做的吗？我该如何解决这个问题？

【问题讨论】：

API 调用返回什么状态码？
他们是否在“历史记录”选项卡中被选中？
状态码为 200。请求不会出现在“历史记录”选项卡中。

标签： ajax angularjs glimpse

【解决方案1】：

我知道这是一个老问题，但网络配置中的以下内容对我有用：

<glimpse defaultRuntimePolicy="On" endpointBaseUri="~/Glimpse.axd">
    <runtimePolicies>
      <statusCodes>
        <add statusCode="201" />
        <add statusCode="202" />
        <add statusCode="203" />
        <add statusCode="204" />
        <add statusCode="404" />
      </statusCodes>
    </runtimePolicies>
</glimpse>

Glimpse 还通过 X-Requested-With: XMLHttpRequest 标头识别 AJAX 调用。默认情况下，AngularJS $http 调用不包含此标头，因此它们不会显示在 Glimpse 的 AJAX 面板中。我们可以更改 $httpProvider 的默认值以始终添加此标头...

app.config(['$httpProvider', function ($httpProvider) {
    $httpProvider.defaults.headers.common = { 'X-Requested-With': 'XMLHttpRequest' };
}]);

来源：http://anthonychu.ca/post/getting-angularjs-http-and-web-api-to-work-with-glimpse （请注意链接示例中的错误大小写，请改用上面的）

【讨论】：

在 AngularJS 1.1.x+ 中，您需要实现拦截来设置公共标头 stackoverflow.com/questions/14183025/…。我已经这样做了，我可以看到标题，尽管在 Glimpse 的 AJAX 调用列表中我只看到了对 html 视图的动态请求，而没有看到 JSON 请求。有什么建议吗？

【解决方案2】：

我在尝试将 glimpse 与 pace.js 一起使用时遇到了类似的问题。删除它可以让 ajax 请求一目了然地正确传播。

您可以尝试禁用其他处理 ajax 事件的 javascript 库，看看是否有更好的运气。我的最终解决方案是为管理用户禁用 pace.js（无论如何，只有那些会看到一瞥 UI 的用户）。

【讨论】：