Attempting to integrate the Google Analytics API with Angular, I first load the analytics script:
<script src="https://apis.google.com/js/client.js"></script>
After loading the script, I use console.log to check the global gapi variables created by the API script. The object is returned as expected, containing an auth property. However, gapi.auth shows as undefined.
If I introduce a two-second delay before running the function, it works correctly. Here's an illustration of what happens:
https://i.sstatic.net/wGLNM.png
Interestingly, all properties are present in the initial object:
https://i.sstatic.net/6sq3z.png
The later version has a preview while the earlier one does not. Could this be why I can only access the properties after waiting for 2 seconds?
UPDATE:
To address the issue of waiting for gapi.auth to be loaded, I added the following checker at the beginning of my script. However, it seems to be stuck and never completes:
while (gapi.auth === undefined) {
console.log("Still undefined");
}
console.log("Loaded now");