Real User Monitoring - Custom APIs

Custom APIs are used to set dynamic values for user IDs, capture Javascript (JS) errors, specify session timeout, and more. This document will explain the various type of custom APIs available in Site24x7, and the syntax to use them.

Ensure that you have deployed the latest Real User Monitoring (RUM) script for custom APIs to work

Available APIs:

Custom User ID
Custom Breadcrumbs
Track Console Events
Exempt Keywords
Max Session Timeout Duration
End Current Session
Capture JS errors
Environment
Track Asynchronous Callbacks
Track Web Pages with Query Params

1.Custom User ID:

By default, a unique user ID is generated by the RUM script. If you want to customize user IDs, you can do so by implementing the following syntax.

This comes handy when you want to track metrics or debug issues specific to a particular user.

Syntax:

/**
* @param {String} RUM API to set user name
* @param {String} Unique user identifier to be sent to site24x7 RUM
*/
s247r('userId',"user@example.com")

2.Add Custom Breadcrumbs:

Set custom breadcrumbs for easy identification in JS errors.

Syntax:

/**
* @param {String} RUM API to add breadcrumbs in error reporting
* @param {String} Breadcrumbs to be sent to site24x7 RUM error reporting
*/
s247r('addBreadCrumbs',"setTimeoutFunction");

3.Track Console Events: ( js errors )

By default, console events are not tracked. Use the API given below to track console events. This is used to add console events in JS error breadcrumbs.

Syntax:

/**
* @param {String} RUM API to track console events {WARNING,LOG,ERROR,INFO} to view in breadcrumbs
* @param {Boolean} enables tracking console events . Default value is false .
*/
s247r('trackConsoleEvents',true);

4.Exempt Keywords : ( general )

By default, alpha numeric keywords in transaction names are obfuscated. For example, a transaction with name home/site24x7.html will be shown as home/site*x*.html . If you want to exempt a keyword from getting obfuscated, provide it as a comma separated string, as shown in the below snippet.

Syntax:

/**
* @param {String} RUM API to exempt keywords
* @param {String} Comma separated strings to be exempted
*/
/** in the below example, txns containing site24x7 and real-user-monitor will be exempted from obfuscation*/
s247r('exemptKeywords','site24x7,real-user-monitor');

5.Max Session Timeout Duration: ( user sessions )

By Default 900000 ( 15*60*1000 ,15minutes ) is the timeout for a session . This can be altered using the below js snippet .

Syntax:

/**
* @param {String} RUM API to manually set the maximum session duration
* @param {Number} Session duration in millis
*/
/** in the below example the timeout is set to 1min ( 1*60*1000 )*/
s247r('maxSessionDuration',60000);

6.End Current Session: ( User Sessions )

To end the current session and start the next page navigation as a new session, use the below given syntax.

Syntax:

/**
* @param {String} RUM API to end the current session
*/
s247r('endCurrentSession');

site24x7RumApiEndPoint: ( User Sessions ) Option to provide url to proxy payloads to the Site24x7 through your own server

Syntax:

/**
* @param {String} RUM API to set the api endpoint
* @param {String} url for the api endpoint
*/
s247r('site24x7RumApiEndPoint','https://localhost:6443');

7.Capture Js Errors : ( js errors )

Js errors can be manually captured and sent to site24x7 rum servers by using the below snippet . This is particularly useful when sending errors by intercepting global error handlers.

Syntax:

try{
unKnownFunction();
}
catch(err){
/**
* @param {String} RUM API to manually capture js errors
* @param {Error} Error object for site24x7 error reporting
*/
s247r('captureException',err);
}

8.Environment :

Set custom environment details for filtering RUM data across various environment setups like development, debug, production, etc.

Syntax:

/**
* @param {String} RUM API to set the environment setup like production,development,debug, etc
* @param {String} Custom environment string for filtering RUM data
*/
s247r("environment", "production");

9.Track Asynchronous Callbacks:

Supports global error handling for asynchronous browser functions callback like setTimeout/setInterval.

Syntax:

/**
* @param {String} RUM API to track js errors in asynchronous functions
* @param {Boolean} Enables|Disables tracking the above functionality. The Default value is false
*/ s247r("trackAsynchronousCallbacks", true);

10.Track Web Pages with Query Params:

Query params are not captured by default in web pages; if you need to track webpages and query params, use the below API to track transactions with query params.

Syntax:

/**
* @param {String} RUM API to track webpages with queryparams. By default the queryparams are ignored
* @param {Boolean} Enables|Disables tracking the above functionality . The Default value is false
*/ s247r("trackTransactionsWithQueryParams", true);

Code Snippet for various SPA frameworks:

Angular JS

angular.module("app").factory('$exceptionHandler',['$log', function($log) {
return function myExceptionHandler(exception, cause) {
$log.warn(exception,cause);
s247r('addBreadCrumbs',cause);
s247r('captureException',exception);
};
}]);

Angular 2

import { ErrorHandler, Injectable} from '@angular/core';
@Injectable()
export class GlobalErrorHandler implements ErrorHandler {
constructor() { }
handleError(error) {
s247r('captureException',error);
}
}

VueJS

Import Vue from 'vue';
Vue.config.errorHandler = (err, vm, info) => {
//component in which error occured
s247r('addBreadCrumbs',vm);
//info Vue specific error information such as lifecycle hooks,events etc
s247r('addBreadCrumbs',info);
s247r('captureException',err);
};

Capture custom error message:

var error = new Error("my custom error message");
s247r('captureException',error);