I have an angular project where I am looking to incorporate AppInsight with custom telemetry (role). The project is built in Angular using TypeScript, and I successfully integrated appinsights by following this tutorial. However, when attempting to add custom telemetry as outlined in this guide, which is primarily for Java/JavaScript/Node.JS, I encountered an issue.
When trying to implement the JS code snippet below:
this.appInsights.queue.push(() => {
this.appInsights.addTelemetryInitializer((envelope) => {
envelope.tags["ai.cloud.role"] = "your role name";
envelope.tags["ai.cloud.roleInstance"] = "your role instance";
});
});
An error was thrown:
TS2339: Property 'queue' does not exist on type 'Initialization'.
This could be due to the code being in JavaScript rather than TypeScript.
I also attempted a different approach from this source, but it did not yield any successful results:
this.appInsights.addTelemetryInitializer(envelope => {
envelope.tags['ai.cloud.role'] = 'your cloud role name';
envelope.baseData.properties['item'] = 'some property';
});
The provided code belongs to my MonitoringService:
import {Injectable} from '@angular/core';
import {environment} from '../../../../environments/environment';
import {ApplicationInsights} from '@microsoft/applicationinsights-web';
@Injectable()
export class MonitoringService {
appInsights: ApplicationInsights;
constructor() {
this.appInsights = new ApplicationInsights({
config: {
instrumentationKey: environment.appInsights.instrumentationKey,
enableAutoRouteTracking: true // option to log all route changes
}
});
this.appInsights.queue.push(() => {
this.appInsights.addTelemetryInitializer((envelope) => {
envelope.tags["ai.cloud.role"] = "your role name";
envelope.tags["ai.cloud.roleInstance"] = "your role instance";
});
});
this.appInsights.loadAppInsights();
}
logPageView(name?: string, url?: string) { // option to call manually
this.appInsights.trackPageView({
name: name,
uri: url
});
}
logEvent(name: string, properties?: { [key: string]: any }) {
this.appInsights.trackEvent({name: name}, properties);
}
logMetric(name: string, average: number, properties?: { [key: string]: any }) {
this.appInsights.trackMetric({name: name, average: average}, properties);
}
logException(exception: Error, severityLevel?: number) {
this.appInsights.trackException({exception: exception, severityLevel: severityLevel});
}
logTrace(message: string, properties?: { [key: string]: any }) {
this.appInsights.trackTrace({message: message}, properties);
}
}
I even tried updating the Microsoft dependency from version 2.4.4 to 2.5.10, yet it did not produce any noticeable changes.
Despite having a role configured within AppInsights, it seems that it is not being set correctly.