Related pages:

This page covers how to configure the JavaScript Agent in the Controller UI. To set up Browser Real User Monitoring, you must configure the JavaScript Agent and then inject the JavaScript Agent code snippet.

To access JavaScript configuration:

  1. In the Controller UI, go to a browser application. 
  2. In the left-hand panel, go to Configuration > Configure the JavaScript Agent. 

Configure the JavaScript Agent

To configure the JavaScript Agent in the Controller:

  1. Select a hosting option.

  2. Customize the code snippet in Step 2: Advanced settings (Optional). 

  3. Click Save.

Configure Advanced Configurations in the Controller UI

The UI-based advanced configurations are available for SaaS Controller version 20.7.0 and later.

In the Controller UI, you can specify advanced configurations. When you check a box, such as Use HTTPS by default, the HTML snippet automatically updates to reflect the selection, such as config.useHTTPSAlways = true. The table below lists each setting's documentation and summary. 

ConfigurationSummary
Use HTTPS by defaultUse HTTPS as the default transport protocol for the JavaScript Agent. If unchecked, the agent chooses the transport protocol used to load the base page.
Set cookie to strict domainLimit the cookie to the full strict domain name. If unchecked, the cookie is set to the broadest version of the originating domain (e.g., *.domain.com).

Set GeoServer URL

If your application uses internet IP addresses or users connect through a VPN, enter your custom GeoServer URL to map internal IP addresses to physical locations. If unchecked, end-user locations are resolved using the default GeoServer.
Configure URL length Set the maximum number of segments and characters in resource URLs to view more or less of a URL in the Controller UI.
Hide URL query stringBy default, URL query strings may be long or contain sensitive information. Check this box to hide the full string from the Controller UI.
Cross-domain session correlationEnable sessions to continue across subdomains. If unchecked, sessions are restricted to one domain and navigating from one domain to another will end the session.
Configure request origin locationSet a specific IP address or location as the origin of the request. You can specify only the IP address, or the complete location (IP, country, region, and city).
Configure resource optionsConfigure which resources are monitored based on how they are ordered, the maximum number of resources that will be evaluated, and whether the resource timing buffer should be cleared when it's full.
Modify resource sampling optionsYou can modify how the resources are ordered (using the sampling algorithm) and the maximum number of resources to be evaluate.
Capture page titleCapture the page title as part of the beacon, displayed in Browser Snapshots. Uncheck this setting to hide the page title for security/privacy reasons. Check this setting to set a custom page title with an arbitrary URL string.
Enable SPA2 monitoringMonitor single-page applications (SPAs) to detect virtual pages and correlate resources, JavaScript errors, and AJAX requests.
Enable resource timing buffer clearing for SPAsFor SPAs, the JavaScript Agent, by default, clears the resource timing buffer after it is full and saves the data in a local buffer. You can configure the JavaScript Agent so that the resource timing buffer is not cleared to capture resource timing data. 
Set the custom page nameThis page name is used to identify and group pages in Pages & AJAX Requests. If unchecked, the default page name consists of the hostname, port, and path.
Filter virtual pagesConfigure rules to exclude specific virtual pages from being monitored.
Monitor Fetch API callsBy default, the JavaScript Agent monitors Fetch API calls for all SPAs except applications using Zone libraries, including Angular applications. Only consider disabling this setting for specific use cases.
Set AJAX request limitTo prevent an overload of AJAX requests, you can limit the number of requests sent per base and virtual pageview. The limit is 250 requests for single-page applications (SPAs) and 50 for non-SPAs.
Filter XHR calls by URLInclude or exclude specific XHR calls to be monitored.

Additional Manual Configurations

The table below lists additional advanced configurations not included in the Controller UI. 

ConfigurationSummary
Report events with the JavaScript APIThe JavaScript API enables you to manually report events to the agent so that it can time the various parts of your virtual page loads and correlate Ajax calls to those page loads. You can also capture and report errors with this API.
Limit beacon typesBy default, sending image beacons is disabled and beacons are only sent with Cross-Origin Resource Sharing (CORS). If you have an older browser that does not support CORS beacons, you can enable sending image beacons.
Disable browser monitoring programmaticallyFor pages in which the JavaScript Agent was injected manually, you can disable the agent programmatically by adding a script to the header.
Handle the window.onerror event

If any script on your monitored web pages or library code sets the JavaScript window.onerror event, add the method ADRUM.listenForErrors() to the page immediately after setting window.onerror.

Set Ajax request names based on captured POST parametersYou can configure the JavaScript Agent to capture POST parameters and then use the parameter(s) to name the Ajax request in Pages & Ajax Requests. This configuration enables you to identify and sort Ajax requests from the same page based on POST parameter(s).
Set custom virtual page namesYou can configure the JavaScript Agent to use any arbitrary string (that is not necessarily a part of the URL) to name a virtual page.
Add custom user data to a page browser snapshotYou can add user information that is specific to your application to a browser snapshot. The information is expressed as key-value pairs that are attached the JavaScript Agent configuration and later included in the beacons sent to the EUM Server.

Configure On-Premises Hosting

The sections below describe hosting options for on-premises setups. 

Configure Shared-Hosting for On-Premises

If you are using shared hosting and do not want to use the default CDN, follow these instructions to provide your own CDN for only hosting the main JavaScript Agent file (adrum-[version].js):

  1. From the Controller Admin, navigate to the Controller Settings page.
  2. Find the settings eum.jsagent.cdn.host.http and eum.jsagent.cdn.host.https.
  3. For the values of those two settings, enter the URLs to where the JavaScript Agent files are being hosted.

  4. Confirm that these URLs are used in the HTML snippet that you manually inject in the page.

Configure Self-Hosting for On-Premises 

If you are self-hosting and don't want to use the default CDN, you can follow these instructions to provide your own CDN for hosting all of the JavaScript Agent files:

  1. From the Controller Admin, navigate to the Controller Settings page.
  2. Find the settings eum.jsagent.cdn.host.http and eum.jsagent.cdn.host.https.
  3. For the values of those two settings, enter the URLs to where the JavaScript Agent files are being hosted.

  4. Confirm that these URLs are used in the HTML snippet that you manually inject in the page.

Next Steps

After you configure the JavaScript Agent, you inject the code snippet with one of the following methods:

See Overview of Injection Types for information about the differences between the injection methods.