End User Monitoring (EUM)

cancel
Showing results for 
Search instead for 
Did you mean: 

Re initialize App Dynamics on the page after a ajax request

SOLVED
Highlighted

Re initialize App Dynamics on the page after a ajax request

Hi All,

 

I am currently working on trying to get End User Monitoring enabled on a GuideWire ClaimCenter. This application is a SPA built in Gosu(subset of Java).

 

This application works in a rather strange way. First the page is rendered to the screen and it basically consits of two iFrames and a few scripts. Then an Ajax call is made to the Application which creates a Model for the whole page and all the elements. This Model is sent back to the page via Ajax to some Javascript objects. These Javascript objects/ functions then create up the rest of the HTML that is needed for the page from the Model which was just passed to it. 

 

Now what i want to try and do is add some custom data to be sent to AppD which contains some information which i need to take from the page after it has been completely rendered, i.e 

 

The first call to request the Model object needs to have completed,
The Javascript objects/functions need to render the rest of the page based on the Model which it has just received. 

 

I have tried adding the addCustomData script blocks that allow AppD to capture extra user defined information but it is getting called too early.

 

This is what is actually happening.

1. First empty page with iFrames is rendered.

2. AppD initialises itself now.
3. Now the calls to addCustomData are executed.

4. Now the other ajax call is made and the rest of page is built.

 

My question is, is there a way to force AppD to re-initialze after the page has completely rendered?
Or is there a way to retrigger the addCustomData calls after the rest of the page has been rendered?

 

any help with be greatly appreciated. 

Re initialize App Dynamics on the page after a ajax request
7 REPLIES 7
AppDynamics Team

Re: Re initialize App Dynamics on the page after a ajax request

HI Mahmood,

 

If you are using JS agent version 4.3.+ then it gives a way to attach the user data to AJAX calls originating after the onLoad() event.

See this for example:

https://docs.appdynamics.com/display/PRO43/Add+Custom+User+Data+to+a+Page+Browser+Snapshot

 

I am attaching a very basic page to show how we can attach user data to ajax event after onLoad(). See attachment.

This might not be the exact situation but it should give a hint.

 

Let me know if that help

 

Regards,

Gaurav Soni



Found something helpful? Click the Accept as Solution button to help others find answers faster.
Liked something? Click the Thumbs Up button.

Re: Re initialize App Dynamics on the page after a ajax request

Hi Gaurav,

 

I did try to implement the code from the example that you sent to me however it didnt work.

 

If you have a look at the page there are two different examples. In on example there are double quotes around the PageVIew object below, and in the other example there are no quotes around it 

Example 1

 PageView: function(context) {

                    ...
                }
 
Example 2
 "PageView": function(context) {
 
 
I have tried both ways of doing this, i.e. with and without quotes but i get the same error.
 
The error is Uncaugth Syntax error : Unexpected token
 
AppDynamics Team

Re: Re initialize App Dynamics on the page after a ajax request

HI Mahmood,

 

Can you attach your implemented code? Also, generate and attach the Chrome HAR file along with JS error from chrome console?

Refer : https://docs.appdynamics.com/display/PRO42/Create+a+HAR+file

 

Regards,

Gaurav Soni



Found something helpful? Click the Accept as Solution button to help others find answers faster.
Liked something? Click the Thumbs Up button.

Re: Re initialize App Dynamics on the page after a ajax request

Hi,

 

I cannot attach the HAR file becuase the DEV that was helping me have a look at this is no off work for the next week so i dont have access to that code. 

 

As for the implemented code i cant give it all to you but here are the important parts. 

 

First Example Tried with QUOTES


window['adrum-start-time'] = new Date().getTime();
(function(config){
config.appKey = 'APPKEY';
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};
userEventInfo: {
"PageView": function(context) {     //  quotes used around the PageView object 
return {
userData: {
username: "PageView [" + window.userName + "]",
pagename: "PageView [" + window.calledFrom + "]"
},
userDataBoolean: {
isWorking: true
}
}
},
"Ajax" : function(context) {  //  quotes used 
return {
userData: {
username: "Ajax [" + window.userName + "]",
pagename: "Ajax [" + window.calledFrom + "]"
},
userDataBoolean: {
isWorking: true
}
}
},
"VPageView": function(context) {  //  quotes used 
return {
userData: {
username: "VPageView [" + window.userName + "]",
pagename: "VPageView [" + window.calledFrom + "]"
},
userDataBoolean: {
isWorking: true
}
}
}
}
})(window['adrum-config'] || (window['adrum-config'] = {}));
if ('https:' === document.location.protocol) {
document.write(unescape('%3Cscript')
+ " src='https://cdn.appdynamics.com/adrum/adrum-4.3.2.1.js' "
+ " type='text/javascript' charset='UTF-8'"
+ unescape('%3E%3C/script%3E'));
} else {
document.write(unescape('%3Cscript')
+ " src='http://cdn.appdynamics.com/adrum/adrum-4.3.2.1.js' "
+ " type='text/javascript' charset='UTF-8'"
+ unescape('%3E%3C/script%3E'));
}

Second Example Tried without QUOTES

window['adrum-start-time'] = new Date().getTime();
(function(config){
config.appKey = 'APPKEY';
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};
userEventInfo: {
PageView: function(context) {     //  quotes not used 
return {
userData: {
username: "PageView [" + window.userName + "]",
pagename: "PageView [" + window.calledFrom + "]"
},
userDataBoolean: {
isWorking: true
}
}
},
Ajax : function(context) {  //  quotes not used 
return {
userData: {
username: "Ajax [" + window.userName + "]",
pagename: "Ajax [" + window.calledFrom + "]"
},
userDataBoolean: {
isWorking: true
}
}
},
VPageView: function(context) {  //  quotes not used 
return {
userData: {
username: "VPageView [" + window.userName + "]",
pagename: "VPageView [" + window.calledFrom + "]"
},
userDataBoolean: {
isWorking: true
}
}
}
}
})(window['adrum-config'] || (window['adrum-config'] = {}));
if ('https:' === document.location.protocol) {
document.write(unescape('%3Cscript')
+ " src='https://cdn.appdynamics.com/adrum/adrum-4.3.2.1.js' "
+ " type='text/javascript' charset='UTF-8'" 
+ unescape('%3E%3C/script%3E'));
} else {
document.write(unescape('%3Cscript')
+ " src='http://cdn.appdynamics.com/adrum/adrum-4.3.2.1.js' "
+ " type='text/javascript' charset='UTF-8'" 
+ unescape('%3E%3C/script%3E'));
}

Re: Re initialize App Dynamics on the page after a ajax request

Hi,

 

I've managed to get it working locally on my machine and have created a HAR file.

 

AppDynamics Team

Re: Re initialize App Dynamics on the page after a ajax request

Hi Mahmood,

 

Sorry for delayed response. Do you say you can now get the custom user data in EUM now? If yes, that's great, if not, let me know the outstanding issue please.

 

Regards,

Gaurav Soni



Found something helpful? Click the Accept as Solution button to help others find answers faster.
Liked something? Click the Thumbs Up button.

Re: Re initialize App Dynamics on the page after a ajax request

Hi,

 

Yes i am now seeing data being captured in AppD EUM. However some of my requests are being lost, however i have raised another request for this issue.