Expand my Community achievements bar.

Applications for the 2024 Adobe Target Community Mentorship Program are open! Click to the right to learn more about participating as either an Aspirant, to professionally level up with a new Certification, or as a Mentor, to share your Adobe Target expertise and inspire through your leadership! Submit your application today.

how to fetch data from an API and render experience which contain response of the API

Avatar

Level 3

Hi,

I have an use case in which i need to fetch data from an API and render experience which contain response of the API

For accomplishing above scenario i am using usign DTM and adobe target.

  1. i have created a data element using custom script which contain XMLHttpRequest
  2. i have created a page load rule which triggers on dom ready from where i am passing value as a mbox global parameter to adobe target
  3. i am using mbox global parmeter in adobe target and rendering experience.

After page load everything works fine in console but i'm getting response as empty string in adobe experience cloud debugger.

Can any one let me know where i am going wrong?

Below is the custom script code for data element.

    var request = new XMLHttpRequest();

    request.onreadystatechange = function() {

        if (this.readyState == 4 && this.status == 200) {

               console.log(this.responseText);

               var response = JSON.parse(this.responseText);

               return response.id; //the data element will return id of response

        }

    };

    request.open('GET', 'https://examplev1/query?v=20160910&query=hi&lang=en-us&sessionId=session123', true);

    request.setRequestHeader("Content-type", "application/json");

    request.send();

0 Replies