How to inject JS agent - User Experience Monitoring

[CommunityUser]

Hello,

I've trying to configure UEM for an application ., but im bit confused with injecting JS agent to start with it.

I've read the documentation , but im feeling little tricky to inject it.

could someone please help me on this "HOw to inject JS agent to instrument an application", do we need place JS script into web page source directly or is there any other way. Could you please advise. Thanks

Regards,

Soundarajan

[Chitra_Lal · Accepted solution]

Hi Soundarajan,

Let me try simplify it for you. 

Q: HOw to inject JS agent to instrument an application

There are more than 1 ways to do this. Some of which require modifying the page directly as you mentioned. But then soem of the options do not require you to touch your code. But which one you can use will depend on the support matrix based on what is your application type, framework etc. So you can not choose one that is not supported for your type of application.

Types of injection; Basically there are three possible approaches as listed below.

(a) Automatic injection, which is done in controller UI itself and you do not need to modify your code at all. But this one, is supported for a very narrow set of application pgaes, only those taht are built on Jasper-supported JSP (Java), ASP.NET, or ASPX (.NET) frameworks. Please refer to the below doc link for details. 
https://docs.appdynamics.com/display/PRO44/Automatic+Injection 

(b) Assisted injection: Assisted injection is when your server-side application injects the JavaScript Agent into your browser application. But this again has two flavours and one of them(named " attribute injection") needs direct coping of the code snippets into your page template however the other one (named " injection rules" does not require any direct code changes, your agent will do that based on your rules. 

Please refer to below doc link for details: https://docs.appdynamics.com/display/PRO44/Assisted+Injection

(c) Manual injection: Manual injection is supported on all platforms and frameworks and needs to be configured in your application pages directly, which are hosted on your application server. Refer to below doc link for details:
 https://docs.appdynamics.com/display/PRO44/Manual+Injection 

You can also find these related links useful for understanding this entire concept:
https://docs.appdynamics.com/display/PRO44/Configure+the+JavaScript+Agent

https://docs.appdynamics.com/display/PRO44/Injection+Using+Nginx 

https://docs.appdynamics.com/display/PRO44/Injection+Using+Apache

Hope this info helps. Let me know in case you have further queries. 

Thanks,

Chitra 

[Mondli_Mabaso1]

I, too, found this very helpful. Thanks guys.

[Chitra_Lal · Accepted solution]

Hi Soundarajan,

Let me try simplify it for you. 

Q: HOw to inject JS agent to instrument an application

There are more than 1 ways to do this. Some of which require modifying the page directly as you mentioned. But then soem of the options do not require you to touch your code. But which one you can use will depend on the support matrix based on what is your application type, framework etc. So you can not choose one that is not supported for your type of application.

Types of injection; Basically there are three possible approaches as listed below.

(a) Automatic injection, which is done in controller UI itself and you do not need to modify your code at all. But this one, is supported for a very narrow set of application pgaes, only those taht are built on Jasper-supported JSP (Java), ASP.NET, or ASPX (.NET) frameworks. Please refer to the below doc link for details. 
https://docs.appdynamics.com/display/PRO44/Automatic+Injection 

(b) Assisted injection: Assisted injection is when your server-side application injects the JavaScript Agent into your browser application. But this again has two flavours and one of them(named " attribute injection") needs direct coping of the code snippets into your page template however the other one (named " injection rules" does not require any direct code changes, your agent will do that based on your rules. 

Please refer to below doc link for details: https://docs.appdynamics.com/display/PRO44/Assisted+Injection

(c) Manual injection: Manual injection is supported on all platforms and frameworks and needs to be configured in your application pages directly, which are hosted on your application server. Refer to below doc link for details:
 https://docs.appdynamics.com/display/PRO44/Manual+Injection 

You can also find these related links useful for understanding this entire concept:
https://docs.appdynamics.com/display/PRO44/Configure+the+JavaScript+Agent

https://docs.appdynamics.com/display/PRO44/Injection+Using+Nginx 

https://docs.appdynamics.com/display/PRO44/Injection+Using+Apache

Hope this info helps. Let me know in case you have further queries. 

Thanks,

Chitra 

[CommunityUser]

Hi Clal.,

Thanks much for your detailed solution and documents ., its more helpful to proceed with my work. 
Thank you so much !!

Regards,

soundarajan

[Gaurav_Soni]

Hi,

There are a couple of ways to do this. 

- Manual injection

This is pretty straightforward method where you need to put the below config code at the start of <head> tag 

<script>
window['adrum-start-time'] = new Date().getTime();
(function(config){
    config.appKey = 'YOUR 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 : false};
})(window['adrum-config'] || (window['adrum-config'] = {}));
</script>
<script src='https://cdn.appdynamics.com/adrum/adrum-latest.js'></script>

If you want to host the 'https://cdn.appdynamics.com/adrum/adrum-latest.js' please download and replace the path in the last <script> tag accordingly.

https://docs.appdynamics.com/display/PRO43/Manual+Injection

- Automatic injection:

If you have a application which is also instrumented with our Java/.Net Application agent, then you can go in the APM application's configuration > User Experience App Integration module and turn on the automatic injection. The Application agent will do the JS agent injection for you. You do not have to change or add anything in your code.

https://docs.appdynamics.com/display/PRO43/Automatic+Injection

Please note: 

Automatic injection is available only for server-side applications built on Jasper-supported JSP (Java), ASP.NET, or ASPX (.NET) frameworks. 

If the server-side application does not return well-formed HTML, the JavaScript Agent may not be able to instrument the page. For example, the JavaScript Agent may not be able to instrument HTML pages that are missing elements or have unclosed tags.

[CommunityUser]

Hi Gaurav,

Thanks much for your quick response on this.

So if im doing manual injection , should i place those mentioned snippet of tags directly into the source code of web page to instrument right ?

Regards,

Soundarajan

[Gaurav_Soni · Accepted solution]

Yes, Soundarajan.

Make sure you add them to master template that all pages using the template get instrumented.

Before you add the code please create a user experience application manually under User Experience tab

and then go in the Application > Configuration > Instrumentation to get the EUM APP KEY that will go in instrumentation code.

[CommunityUser]

Thanks a lot Gaurav for your solution ., its more relevant and solved my hiccup. Thanks

Regards,

Soundarajan

[Gaurav_Soni]

You are welcome! 🙂