[SOLVED] Callback function never executes

[SOLVED] Callback function never executes
0.0 0

#1

I am working on the weather challenge.
HTM5 Geolocation has successfully returned my coordinates…
I plug these into my url for the Dark Sky API call.
open.window(url) returns the JSON response as expected.
Then I get into trouble.

  var myWindow = window.open(urlWeather); //works ok
  console.log("before getJSON call"); //works ok
  $.getJSON(urlWeather, function(json){
    console.log("inside getJSON callback"); //NEVER HAPPENS
  });
  console.log("after getJSON call");//works ok

It appears as though the .getJSON call does not execute the callback function.

I have the same problem with a subsequent .get call to return address info from a google API (not shown here).

I understand that the calls are AJAX, i.e. asynchronous, so I can expect that the sequence of console.log calls may be different but I would expect the one inside the callback function to at least execute when the .getJSON call has actually returned.
I am really stuck here, any help much appreciated.
Thanks in advance.
Rainer


#2

Have you checked the console? Callback function in jQuery.getJSON() executes only on success.


#3

@waqarHocain

Thank you very much ! I was fixated on the codepen console which only showed my console.log output.
I opened the browser console which showed the Cross-Origin Request Blocked error.
SO it is fixed now by prepending https://cors-anywhere.herokuapp.com.

I am still a little confused though. I thought this problem arose when one crosses between an secured and unsecured http domains. I am https at both ends. Please excuse me, I only have a very rudimentary understanding.

Thanks again.


#4

CORS is about “cross-origin” requests not whether http or https is used - from https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS:

A resource makes a cross-origin HTTP request when it requests a resource from a different domain, protocol, or port to its own. For example, an HTML page served from http://domain-a.com makes an src request for http://domain-b.com/image.jpg. Many pages on the web today load resources like CSS stylesheets, images, and scripts from separate domains.

CORS is confusing - the fix is to move the request for resources from client-side to server-side - sometimes it’s possible to modify the client-side request with a CORS-specific parameter or by switching to JSONP instead of JSON


#5

Thank you for the clarification.