Expand my Community achievements bar.

Guidelines for the Responsible Use of Generative AI in the Experience Cloud Community.
SOLVED

Retrieving Client Context Data in AEM Component

Avatar

Level 2

Hi

I have a requirement to show a specific content based on city. Content is something like show nearby major city / POI. Say if some has accessed the website from about 100 KMs from Sydney, Australia then Sydney becomes the major city and show one its POIs. While getting POI is not an issue, my question is around getting City / State / Country of the user visiting the site. For this specific item, while I am able to achieve the result using HTML5 geolocation APIs, I am more interested to use Client Context feature of AEM. With this context:

1) I was able to create a context store and getting values such as lat / long / city / state / country etc.. as JSON response and render it in Client Context (i.e. dragging /dropping the custom store in the client context of the page, showing the correct data)

2) Now I want to access this data (i.e. store's attributes at a JS in my component. This is where I am facing an issue and appreciate if someone can guide me how can I can access these data in a component JS (inside the JSP). I used following code in a script tag in component JSP but it did not recognize the store and returned as "undefined"

var store = CQ_Analytics.StoreRegistry.getStore("store name"); if (!store) { CQ_Analytics.JSONPStore.registerNewInstance("<store name", "<serviceURL>", {}); }

where serviceURL = http://api.wipmania.com/jsonp?callback=${callback}. With this, the value of store comes as "undefined" in an alert when I test it in Authoring. Can anyone give some help in this aspect how to correctly read the values in client context in an AEM component?

Thanks

Anand

1 Accepted Solution

Avatar

Correct answer by
Level 10
3 Replies

Avatar

Employee

Just saw that this was posted in the DTM forum about 4 days ago, so have moved it here. Can anyone help out?

Avatar

Correct answer by
Level 10

Avatar

Level 2

Got this working. Wanted to respond to the group earlier..but here is what I did:

1) Follow the instruction and create a JSONPStore

2) Put following code in the component JSP / script to read the store properties and do content targeting -- 

<script language="javascript">

    CQ.Ext.onLoad(function() {

    CQ_Analytics.ClientContextUtils.onStoreRegistered("wipmania", function() {
   var wipStore = CQ_Analytics.ClientContextMgr.getRegisteredStore("wipmania");

        if(wipStore){
            alert("Latitude: " + wipStore.getProperty("latitude", false));
        } else
        {return null;
        }
    });
});

</script>

Cheers

Anand