API call didn't work

1

Hello , my api call didn’t work. here is js

$(function(){
var C=false;
var apiData;
backgroundImg=['https://cdn.pixabay.com/photo/2016/06/13/22/12/flash-1455285_960_720.jpg',
' https://cdn.pixabay.com/photo/2013/12/09/13/45/waterfall-225961_960_720.jpg',
'http://images.all-free-download.com/images/graphiclarge/drops_rain_glass_220210.jpg','http://wallpaper-gallery.net/images/snow-wallpapers/snow-wallpapers-1.jpg','http://images.all-free-download.com/images/graphiclarge/winter_fog_200960.jpg','https://previews.123rf.com/images/tolokonov/tolokonov1208/tolokonov120800059/14889692-Sky-and-ocean-Abstract-natural-backgrounds-Stock-Photo.jpg','https://cdn.pixabay.com/photo/2015/12/25/13/03/sky-1107579_960_720.jpg'

]
function displayTemp(F,C){
if(C)
return Math.round((F-32)*(5/9)) +'° C';
return Math.round(F) +'° F';

}

$.getJSON('https://freegeoip.net/json/').done(function(location){

// console.log(location);
$('#country').html(location.country_name);
$('#city').html(location.city);
$('#latitude').html(location.latitude);
$('#longitude').html(location.longitude);

$.getJSON('http://api.openweathermap.org/data/2.5/weather?lat='+location.latitute+'&lon='+location.longitude+'&units=imperial&appid=d99414c365ff0845c676431520203ea0', function(data){

apiData=data;
console.log(apiData);
})
})

})

Can anyone help me please?

thanks in advance

2

I cleaned up your code.
You need to use triple backticks to post code to the forum.
See this post for details.

3

Hi,

I found two problems. First, JQuery isn’t loaded (maybe you loaded it in your html.)

The other problem is that you mispelled “latitude” in your url (location.latitute). I discovered this by consoling the whole url string to the console so I could see what it was producing and saw that the string contained “…lat=undefined…”.

1 Like
4

thankyou, this is my first post so i didn’t understand…

5

I have loaded jquery. Yes i have mispelled , (thank you for pointing it) but i corrected it and checked again but it is not working .
Here is my link of codepen

6

What is not working?

When I run your pen, I get the correct data object in my console.

I have to make sure we’re clear - you know to check the console, right? I ask because there are a lot of beginners here that aren’t clear on things like this. There are two consoles - one in your browser (cntrl-shift-j to reach mine in Chrome) and one in the codepen program, at the bottom of the screen.

If you’re not getting that data object in your console, then I’m not sure what the problem is.

7

I am not getting data object in my console.
i am checking in codepen console . It does not show anything.when i run there is nothing on console.
I have also check on chrome console. It gives the error

Mixed Content: The page at ‘https://codepen.io/avi-jkiapt/pen/jmEbVa?editors=0011’ was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint ‘http://api.openweathermap.org/data/2.5/weather?lat=26.4667&lon=80.35&units=imperial&appid=d99414c365ff0845c676431520203ea0’. This request has been blocked; the content must be served over HTTPS.

Can you tell what i do?

8

OK, I wish you’d included that error message in your original post.

There can be problems when you call an http (unsecured) resource from an https (secured) resource.

I believe the problem is that you are calling http://api.openweathermap.org from https://codepen.io. I think if you switch one of those, your problem will be solved.

1 Like
9

okay, I got it. It working thank you so much from bottom of my heart. Thanks a lot…

10

hey, that’s what we do here. Pretty soon you’ll be helping someone with the same problem.

1 Like