[SOLVED] Why do this jQuerry.Ajax() call doesn't work?

See the Pen rybWwa by Egor (@O_Prime) on CodePen.

If you paste commented string into browser’s address bar - it will work just fine.
I also tried hurl.it and jQuery AJAX Code Builder - both working OK. Yet codepen.io logging obscure error object into console.

// http://api.openweathermap.org/data/2.5/weather?lon=42&appid=b20f7acb107b52e1faa0d0a4f85fb9eb&lat=42

$(document).ready(function() {  
  $.ajax({
    url:'http://api.openweathermap.org/data/2.5/weather?',
    data:{
      appid: 'b20f7acb107b52e1faa0d0a4f85fb9eb',
      lat: 42,
      lon: 42
    },
    success: function(r) {
      console.log('success:\n');
      console.log(r);
    },
    error: function(a, b, c) {
      console.log('error:\n');
      console.log(a);
      console.log(b);
      console.log(c);
    }
  });
});

Solution:

First of all, why wouldn’t you give us the “obscure error”? What does it say?

It worked fine for me. Do you have JQuery added? Check settings/JavaScript/add-ons

This is not error “message” but some object that returns in ‘error:’ callback and codepen prevents copying from log anything but strings.

https://yadi.sk/i/CcoviEOo3GftxR

You can also check my codepen: https://codepen.io/O_Prime/pen/rybWwa/

You can open your chrome developer tools to view your errors. You have done this correctly just visit your CodePen on http instead of https http://codepen.io/O_Prime/pen/rybWwa/ . The extra security is stopping the unsecured request as OpenWeatherAPI is http.

2 Likes

visit your CodePen on http instead of https

Thanks!

Thanks for this. I just spent the past two days re-building my project 3 different ways.