如何在 JavaScript 中为网页加载和卸载 Azure App Insights答案

【问题标题】：How to load and unload Azure App Insights for web pages in JavaScript如何在 JavaScript 中为网页加载和卸载 Azure App Insights
【发布时间】：2020-11-03 20:47:04
【问题描述】：

我已按照 guide 和 guide 将 Azure App Insights 添加到我们的 Angular 应用程序。它工作得很好，但我遇到的问题是我们如何有条件地开始/加载和停止/卸载洞察跟踪？

基本上，我们的应用程序中有一个开关，允许用户打开数据收集，Application Insights 应该分析和收集数据。一旦用户关闭此开关，它应该停止分析和跟踪。

似乎一旦我们调用this.appInsights.loadAppInsights()，就无法解锁/卸载/停止监听。如果有办法解锁/卸载/停止收听，请告诉我。

谢谢。

【问题讨论】：

这个问题与角度或打字稿没有任何关系，所以我删除了标签
你在找this doc吗？
感谢杨伊万的回答。当我有机会时，我会尝试一下并回复你。
嘿@IvanYang 感谢您的文档。我在下面发布了我的答案，它似乎有效。如果你想添加你的答案，我可以接受。

标签： javascript azure azure-application-insights

【解决方案1】：

您可以参考文档Disabling telemetry。

例如，如果您想在 javascript 中卸载应用洞察，请使用以下代码：

telemetry.config.disableAppInsights = true;

【讨论】：

【解决方案2】：

我最终使用受 here 启发的 AppInsights 创建了一个与所有事物相关的通用服务。

import { AngularPlugin, AngularPluginService } from '@microsoft/applicationinsights-angularplugin-js';
import {
  ApplicationInsights,
  IEventTelemetry,
  IExceptionTelemetry
 } from '@microsoft/applicationinsights-web';
....

export class ApplicationInsightService {
  private appInsights: ApplicationInsights;

  constructor(private router: Router, private angularPluginService: AngularPluginService) {
    const angularPlugin = new AngularPlugin();
    this.angularPluginService.init(angularPlugin, this.router);
    this.appInsights = new ApplicationInsights({ config: {
      instrumentationKey: 'Your key here',
      extensions: [angularPlugin],
      extensionConfig: {
        [angularPlugin.identifier]: { router: this.router },
      }
    }});
    this.appInsights.loadAppInsights();
    this.appInsights.trackPageView();
  }

  setUserId(userId: string) {
    this.appInsights.setAuthenticatedUserContext(userId);
  }

  clearUserId() {
    this.appInsights.clearAuthenticatedUserContext();
  }

  logPageView(name?: string, uri?: string) {
    this.appInsights.trackPageView({ name, uri });
  }

  logEvent(event: IEventTelemetry, customProperties: { [key: string]: any }) {
    this.appInsights.trackEvent(event, customProperties);
  }

  trackError(exception: Error) {
    let telemetry = {
      exception,
    } as IExceptionTelemetry;
    this.appInsights.trackException(telemetry);
  }

  stopTelemetry() { // !! this is how you stop tracking
    this.appInsights.config.disableTelemetry = true;
  }

  startTelemetry() { // !! this is how you start/re-start it
    this.appInsights.config.disableTelemetry = false;
  }
}

documentation 的 JavaScript 部分没有帮助，因为这些方法/属性不存在，但 C# 文档有所帮助，并且似乎与此类似。

【讨论】：