This page describes how to instrument a browser application by manually injecting the JavaScript Agent. To configure the JavaScript Agent before injection, see Configure the JavaScript Agent.
Manually Inject the JavaScript Agent
The Controller UI allows you to configure the JavaScript Agent, generate an HTML snippet, and add that snippet to the header of the web pages.
- In the Controller UI, go to a browser application.
- In the left navigation menu, select Configuration > Configure JavaScript Agent.
- Configure the JavaScript Agent.
- Save and copy the HTML snippet.
- Add the HTML snippet to the header of the web pages.
JavaScript Agent Placement
The recommended location for the JavaScript Agent is at the top of the <head> section. The adrum.js file captures the time as the page begins to load and measures that amount of time against the time that other timings are calculated for all browsers. Many modern browsers, however, support the Navigation Timing API (see this list), and for these browsers, timings can be acquired via the API. In this case, it is possible to place the JavaScript Agent somewhere else on the page, but useful timing information is only available for those NavTime-capable browsers.
Synchronous Versus Asynchronous Script Load
AppDynamics recommends 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 (through the async attribute), the JavaScript Agent might not report all page data.
Use Previous JavaScript Agent Versions
Previous versions of the agent can be found at the following location, where VERSION is the version number you want to access (for example, 4.5.0.).
http://cdn.appdynamics.com/adrum/adrum-VERSION.js
CODE
- If you are using a SaaS EUM Cloud and want a hosted version of
adrum.js, AppDynamics recommends you use the adrum-latest.js version. However, you can use any version of the JavaScript Agent as it is compatible with any SaaS EUM Cloud version currently being deployed. - If you are using an on-premises EUM Server and want to use a hosted version of
adrum.js, you need to match the adrum.js version to your EUM Server version. - For Controller versions, a JavaScript Agent version is compatible with Controller versions with the same or older versions. For example, JavaScript Agent 20.6.0 is compatible with Controller <= 20.6.0.
Verify Manual Injection
Once the agent is injected, it can take the AppDynamics Controller a few minutes to discover and recognize the page, which must happen before data will begin to appear. If, however, you have configured your page using manual injection and are not seeing Browser RUM metrics after running load for a while, check the web page to confirm that the JavaScript Agent for Browser RUM is present in the page. If not, try injecting the script again.
If, after two attempts, you still do not see Browser RUM metrics, try one of the other injection schemes if they are available for your platform. See Troubleshoot Browser RUM.