Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 3 Next »

Application Insights ist ein Features des Azure Monitors, das die live-Beobachtung von Web-Applikationen erlaubt. Wir können so die Performance überwachen und es als Hilfe zum Debugging verwenden.

https://docs.microsoft.com/en-us/azure/azure-monitor/app/app-insights-overview

Konfiguration Server

Die Konfiguration für den Server kann auf zwei Wege erfolgen:

  • Direkt in der Applikation (üblicherweise durch einen Entwickler)

  • Über den Azure App Service (sofern die App dort gehostet ist)

Beim Azure App Service kann die Application Insight Instanz direkt erstellt werden. Normalerweise wird hier keine zusätzliche Konfiguration benötigt.

Instruktionen für das manuelle aufsetzen und rund um Application Insights finden sich hier:

https://learn.microsoft.com/en-us/azure/azure-monitor/app/app-insights-overview#how-to-use-application-insights

Konfiguration Client

Grundeinstellung

Die Konfiguration des Clients kann direkt über die Grundeinstellungen erfolgen. Der Konfigurations-Schlüssel ist Public:ApplicationInsight der Wert muss dem ConnectionString der Application Insights Instanz entsprechen. Dieser kann normalerweise direkt aus dem Portal von der Übersichtsseite kopiert werden.

Code

Wenn nicht in den Grundeinstellungen konfiguriert, dann kann Applications Insights auch im Code mit eingebunden werden.

In your index.ts add the following lines:

import { ApplicationInsights } from '@microsoft/applicationinsights-web';
import { ReactPlugin } from '@microsoft/applicationinsights-react-js';
import { createBrowserHistory } from 'history';

try {
  const browserHistory = createBrowserHistory({ basename: '' });
  const reactPlugin = new ReactPlugin();
  const appInsights = new ApplicationInsights({ config: {
    connectionString: 'InstrumentationKey=...;IngestionEndpoint=...',
      extensions: [reactPlugin],
      extensionConfig: {
      [reactPlugin.identifier]: { history: browserHistory }
      }
      } });
  appInsights.loadAppInsights();
  appInsights.trackPageView();
} catch {
  // NOP
}

The connection string can be copied from the Azure Portal.

Resources

See here for the official documentation.

See here for the REACT extension.

  • No labels