Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/MarkPieszak/angular-application-insights below:

GitHub - TrilonIO/angular-application-insights: Angular & Azure Application Insights module

Application Insights is an extensible Application Performance Management (APM) service for web developers on multiple platforms. Use it to monitor your live web application. It will automatically detect performance anomalies. It includes powerful analytics tools to help you diagnose issues and to understand what users actually do with your app.

Install & save the library to your package.json:

$ npm i -S @markpieszak/ng-application-insights

# yarn

$ yarn add @markpieszak/ng-application-insights

Now add ApplicationInsightsModule to your Angular Root AppModule:

// 1) Import the Application Insights module and the service provider
import { ApplicationInsightsModule, AppInsightsService } from '@markpieszak/ng-application-insights';

@NgModule({
  imports: [
    // 2) Add the Module to your imports
    ApplicationInsightsModule.forRoot({
      instrumentationKey: 'Your-Application-Insights-instrumentationKey'
    })
  ],
  providers: [ 
     // 3) Add AppInsightsService to your providers list
     AppInsightsService
  ]
})
export class YourRootModule { }

// Use instrumentationKeySetLater
ApplicationInsightsModule.forRoot({
  instrumentationKeySetLater: true // <--
})

// Then later in your Application somewhere
constructor(
  private appInsightsService: AppInsightsService
) {
  appInsightsService.config = {
    instrumentationKey: __env.APPINSIGHTS_INSTRUMENTATIONKEY // <-- set it later sometime
  }
  // then make sure to initialize and start-up app insights
  appInsightsService.init();
}

Through out your application you can now use the AppInsightsService class to fire off AppInsights functionality.

import { AppInsightsService } from '@markpieszak/ng-application-insights';

export class ShoppingCartComponent {
  public cart: [];
  constructor(private appInsightsService: AppInsightsService) {}

  saveCart(user) {
    // MOCK Example of sending a trackEvent()
    // Saving some sample user & cart product data
    this.appInsightsService.trackEvent('ShoppingCart Saved', { 'user': user.id, 'cart': cart.id });
  }
}

ie: https://github.com/TrilonIO/aspnetcore-angular-universal

First, make sure you are only importing the library & the server within the browser-app.module NgModule (do not share it within a common one, as the server isn't able to use this library during it's server-renders).

Secondly, make sure you are calling the injector to get AppInsightsService during ngOnInit:

export class HomeComponent implements OnInit {

  private AIService: AppInsightsService;
  private isBrowser: boolean;

  constructor(@Inject(PLATFORM_ID) private platformId, private injector: Injector) {
    this.isBrowser = isPlatformBrowser(this.platformId);
  }

  ngOnInit() { // <-- 
    if (this.isBrowser) { // <-- only run if isBrowser
      this.AIService = <AppInsightsService>this.injector.get(AppInsightsService); // <-- using the Injector, get the Service
      this.AIService.trackEvent('Testing', { 'user': 'me' });
    } 
  }
}

You can see a list of the API here: https://github.com/Microsoft/ApplicationInsights-JS/blob/master/API-reference.md#class-appinsights

AppInsightsService.trackEvent()
AppInsightsService.startTrackEvent()
AppInsightsService.stopTrackEvent()
AppInsightsService.trackPageView()
AppInsightsService.startTrackPage()
AppInsightsService.stopTrackPage()
AppInsightsService.trackMetric()
AppInsightsService.trackException()
AppInsightsService.trackTrace()
AppInsightsService.trackDependency()
AppInsightsService.flush()
AppInsightsService.setAuthenticatedUserContext()
AppInsightsService.clearAuthenticatedUserContext()

To generate all *.js, *.js.map and *.d.ts files:

To lint all *.ts files:

Copyright (c) 2016-2022 Mark Pieszak

Check out Trilon.io for more info!

Contact us at hello@trilon.io, and let's talk about your projects needs.

Twitter: @Trilon_io

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4