This page explains how to create custom virtual page names.
To name virtual pages with the JavaScript Agent, you need to enable SPA2 monitoring. You can configure the JavaScript Agent to use any arbitrary string, not necessarily a part of the URL, to name a virtual page. The virtual page name must consist of a string of 760 or fewer alphanumeric characters. If the string length exceeds 760 characters, the page name will not be set.
If you are using SPA1 monitoring, the method called to set the name the virtual page will be ignored.
To name a virtual page, you execute the method setVirtualPageName with ADRUM.command as shown below. The ADRUM object is globally accessible after you load the JavaScript Agent (adrum-latest.js).
<head>
<script charset='UTF-8' type='text/javascript'>
window['adrum-start-time'] = new Date().getTime();
(function(config){
config.appKey = '<EUM_APP_KEY>';
...
})(window['adrum-config'] || (window['adrum-config'] = {}));
</script>
<script charset='UTF-8' src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' ></script>
<script type='text/javascript' charset='UTF-8'>
...
ADRUM.command("setVirtualPageName", "myCustomVPName");
</script>
</head>
JS
When you name a virtual page with setVirtualPageName, the custom name will be applied to the next virtual page you manually mark with markVirtualPageBegin. Thus, the virtual page currently being monitored will not get the custom name.
The code example below shows how to call the methods to manually mark the beginning and end of the virtual page as well as execute setVirtualPageName to name the next virtual page that is monitored. See Report Virtual Pages to learn how to manually mark the beginning and end of virtual pages with the JavaScript API.
.controller('VPNaming', ['$scope', '$http', function ($scope, $http) {
$scope.startVirtualPageWithCustomUrl = function () {
console.log("Marking the beginning of the virtual page and waiting for the end to be manually marked.");
ADRUM.markVirtualPageBegin("homepage", true);
}
$scope.startVirtualPageNotWaitingForMarkVirtualPageEnd = function () {
console.log("Marking the beginning of the virtual page and allowing the JS Agent to mark the end of the virtual page.");
ADRUM.markVirtualPageBegin("homepage", false);
}
$scope.endVirtualPage = function () {
console.log("Manually marking the end of the virtual page.");
ADRUM.markVirtualPageEnd();
}
$scope.setVirtualPageName = function () {
console.log("Setting a custom name for the next virtual page to be monitored: have it's beginning and end marked.");
ADRUM.command("setVirtualPageName", "myCustomVPName");
}
}
]
);
JS
