How and where to add VisitorAPI.js , at.js, AppMeasurement.js in angular for implementing server side

[sivaram93]

I am trying to implement server-side target sdk in angular similar to this. 
https://github.com/adobe/target-nodejs-sdk-samples/tree/master/ecid-analytics-atjs-integration

But here in this example it has been given under template index.tpl. The same way it is not working when it is implemented in angular. How or where should i add these snippets and get the serverstate value.  Currently it is added in index.html of angular project. Have tried adding in index.html as well as in specific component. It is not working and still the target content is getting changed for every refresh.

<script>Visitor.getInstance("${organizationId}", { serverState: { visitorState }});

  </script>

  <script>

      window.targetGlobalSettings = {

          overrideMboxEdgeServer: true

      };

  </script>

  <script src="assets/js/at.js"></script> 

 <script src="assets/js/AppMeasurement.js"></script>

  <script>var s_code = s.t(); if (s_code) document.write(s_code);</script> 

There is no proper documentation or example to use target sdk server side to implement in angular.

[Kishore_Reddy · Accepted solution]

Hey @sivaram93 

Hope you are doing well

These reference articles might help:

1. Using Adobe Target in an Angular application
2. Target nodejs SDK
3. Analytics for Target implementation
4. Single Page App (SPA) Visual Experience Composer
5. Adobe Target/Analytics x Angular Integration
6. Adobe Target at.js 2.0 - Single Page Application Implementation (VEC) - video walkthrough

Hope this helps!

Best,

Kishore

[sivaram93]

Hi Kishore,

Thanks for quick turnaround. can i get some examples like github sample implementation or something similar to this,
https://medium.com/ida-mediafoundry/using-adobe-target-in-an-angular-application-f9c17f853dd8

As i am looking to implement via Form composer instead of VEC. Also should i have to include all those js files (at.js, visitorapi.js etc..) in index.html of angular project directory?

i am always getting value as undefined for the below required variables.

  const visitorCookie = TargetClient.getVisitorCookieName(CONFIG.organizationId);

  console.log("visitorCookie",visitorCookie);

  const targetCookie = req.cookies[TargetClient.TargetCookieName];

  console.log("targetCookie",targetCookie);

  const targetLocationHintCookie = req.cookies[TargetClient.TargetLocationHintCookieName];

  console.log("targetLocationHintCookie",targetLocationHintCookie);

Best Regards,
Siva