Supported Frameworks
- Ionic 2
- Ionic 3
- Ionic 4 and above
1. Agent Installation
If you want to include Atatus script with your source, you can add it through package managers such as YARN and NPM.
Install atatus-spa from the npm or yarn registry:
copy
npm install --save atatus-spa
Or
yarn add atatus-spa
Import and initialize atatus to monitor your application:
copy
import * as atatus from 'atatus-spa';
atatus.config('YOUR_API_KEY').install();
For more advanced options on installing your monitoring code, view customizing agent.
2. Atatus Custom Error Handler
Option 1: Atatus Error Handler for Ionic 4 and above.
copy
// /src/app/atatus.handler.ts
import { ErrorHandler } from '@angular/core';
import * as atatus from 'atatus-spa';
atatus.config('0df5e8d5b5914dbd974b18ac036f9bb0').install();
class AtatusErrorHandler extends ErrorHandler {
handleError(error:any) : void {
super.handleError(error);
if (atatus) {
// Send the error to Atatus
atatus.notify(error.originalError || error);
}
}
}
export default AtatusErrorHandler;
Option 2: Atatus Error Hanlder for Ionic 2 and 3.
copy
// /src/app/atatus.handler.ts
import { IonicErrorHandler } from 'ionic-angular';
import * as atatus from 'atatus-spa';
atatus.config('0df5e8d5b5914dbd974b18ac036f9bb0').install();
class AtatusErrorHandler extends IonicErrorHandler {
handleError(error:any) : void {
super.handleError(error);
if (atatus) {
// Send the error to Atatus
atatus.notify(error.originalError || error);
}
}
}
export default AtatusErrorHandler;
3. Include Atatus Error Handler
Replace IonicErrorHandler
with AtatusErrorHandler
in the providers section of @NgModule
copy
// /src/app/app.module.ts
import { ErrorHandler } from '@angular/core';
import AtatusErrorHandler from './atatus.handler';
@NgModule({
// ...
providers: [{provide: ErrorHandler, useClass: AtatusErrorHandler}]
})
export class AppModule { }
4. Optional: Clean path in the custom stack trace
If you want to clean stack frame urls, you can modify as follow us.
copy
// /src/app/atatus.handler.ts
// Clean path in the stack trace
if (atatus) {
atatus.onBeforeErrorSend(function (payload: any) {
try {
var backTraces = payload.backTraces;
for(var i = 0 ; i < backTraces.length; i++) {
var backTrace = backTraces[i];
var filename = backTrace.f;
var indexOfJsRoot = filename.indexOf("/www/");
if (indexOfJsRoot !== -1) {
backTrace.f = filename.substring(indexOfJsRoot);
}
}
} catch (e) {
console.log(e)
}
return true;
});
}