cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Re initialize AppDynamics on the page after a ajax request

mahmood.yousaf
Builder

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(a subset of Java).

This application works in a rather strange way. First, the page is rendered to the screen and it 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 been completed,
The Javascript objects/functions need to render the rest of the page based on the Model that 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 happening.

1. The first empty page with iFrames is rendered.

2. AppD initializes 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-initialize after the page has been 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. 

7 REPLIES 7

Gaurav.Soni
AppDynamics Team (Retired)

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.

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
 

Gaurav.Soni
AppDynamics Team (Retired)

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.

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'));
}

Hi,

 

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

 

Gaurav.Soni
AppDynamics Team (Retired)

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.

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.