Clientlib Javascript calls to Google geocoding and ti...

[fionas76543059]

Hi folks,

I am a total novice with AEM.

I had to write a component which had a JS Client library which made some calls to the Google map API and some calls to other Google services like geocoding and timezone. I finally thought I got everything working and it worked perfectly on the Author instance when I "Viewed as Published".  I have a valid Google Key.  This is the jquery  "map" call that works and the request/response shows up on the Network Pane of my Web Console.

$('.event-location', wrap).html('<a href="https://www.google.com/maps/place/'+map+'" target="_blank">'+ address +'</a>').show();

 This is the jquery call that doesn't even show up on the Network Pane of my Web Console. (It is as if AEM swallowed it.)

$.get("https://maps.googleapis.com/maps/api/geocode/json?key="+ $googleApiKey + "&address=" + address, function(geo_data, geo_status){

 The Author and Publish instances are on the AEM Cloud. I ssh'd into the Publish instance and was able to successfully "curl" the above maps.googleapis.com API call so it doesn't seem to be a firewall issue.

Any thoughts ?  I put the client library "with" its component in /apps and included the call to the Clientlib CSS at the start of the component HTL file and the call to the JS at the end. This seems to be the current recommended way but I didn't see any other components done that way in the legacy code so maybe I've missed something here.

I have read that "Publish" server is more "locked down" that the Author instance so maybe there is some URL blocking or whitelisting or something like that that I don't know anything about.

All suggestions gratefully received!

thanks

Fiona

[arunpatidar · Accepted solution]

Yes, you need to enable an embed source. This can be done by allowing CORS.

This can be enabled at dispatcher level.

[fionas76543059]

Hi Arun, Thanks for the prompt reply. Just to clarify your response. I must get the Publish web server (in fact the Dispatcher) to tell Browsers accessing

[fionas76543059]

my Clientlib Javascript component, that they are allowed to access the maps.googleapis.com GeoCoding API ? How do I do this ? Thanks Fiona

[arunpatidar]

yes, you need to enable it from apache/web server?

https://tecadmin.net/set-access-control-allow-origin-cors-in-apache/

can you tell me what exact error are you facing? you will see error in browser console.

[fionas76543059]

Thanks Arun, I won't be able to try it out until after Christmas but I'll come back then and mark i as Correct. Fiona

[fionas76543059]

hi Arun, Actually on closer examination I found that it wasn't a CORS problem. It was a mixup in old and new client libraries in different places. But I'll press "correct" anyway because it did make sense in the circumstances. thanks again. Fiona