For most situations, the JavaScript Agent works correctly with the default settings. You can, however, customize adrum.js in specific situations, either by adding on to the manual injection scripts, or, in the case of automatic or assisted injection, by having your web application insert the appropriate code.

Add Custom Configuration for the JavaScript Agent

You can add the custom configuration to the Controller UI and then generate the HTML snippet with your configuration.

To do so, follow the steps below:

  1. Open the Configuration page.
  2. Click Configure and download JavaScript Agent.
  3. Expand the Advanced section.
  4. Enter your custom configuration in the text area.
  5. Click Save Config & Generate HTML Snippet.
  6. Copy the HTML snippet to your clipboard or download the JavaScript file.

Set the Beacon URL for On-Premises Deployments

The beacon URL is used to transmit metrics about your application to the EUM Server. When you create a custom configuration, the URLs assigned to the variable config.beaconUrlHttp and  config.beaconUrlHttps in the HTML snippet must be the same as the URL assigned to the EUM property eum.beacon.host and eum.beacon.https.host in the Controller Setting page of the Controller Admin.

For example, the Controller Settings page shown below displays the URLs appdynamics.controller.eum.beacon.hostname and appdynamics.controller.eum.beacon.https.hostname for the properties eum.beacon.host and eum.beacon.https.host respectively.

controller settings UI screen

In the HTML snippet containing your custom configuration, the variables config.beaconUrlHttp and config.beaconUrlHttps shown below must have the same values as given in the Controller Settings of the Controller Admin. In the case that you're using multiple instances of the EUM Server, for example, one SaaS EUM Server and one on-premises EUM Server, you can modify the values to point to one of the EUM Servers.

<script type='text/javascript' charset='UTF-8'>
(function(config){
    config.appKey = '<EUM_APP_KEY>';
    config.adrumExtUrlHttp = 'http://cdn.appdynamics.com';
    config.adrumExtUrlHttps = 'https://cdn.appdynamics.com';
    config.beaconUrlHttp = 'http://col.eum-appdynamics.com';
    config.beaconUrlHttps = 'https://col.eum-appdynamics.com';
    config.xd = {enable : true};
})(window['adrum-config'] || (window['adrum-config'] = {}));

(function (cfg) {
    if (cfg.beacon) cfg.beacon.neverSendImageBeacon = true;
    else cfg.beacon = { neverSendImageBeacon: true };
})(window['adrum-config'] || (window['adrum-config'] = {}));
</script> 
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'></script>
JS

Synchronous versus Asynchronous Script Load

It is recommended that the adrum.js file loads synchronously because once downloaded, the JavaScript Agent begins monitoring for page data such as Ajax events, resources, and errors. If adrum.js loads asynchronously for the first time (via the async attribute), the JavaScript Agent might not report all page data.