Weather web app problem

Weather web app problem
0

#1
I don't know what the problem in my script. Cant get through .getJson. Can you please advise:

$(document).ready(function() {
  

  var pLat=0;
  var pLong=0;

  function myWeather(){
    
  navigator.geolocation.getCurrentPosition(function(position) {  
  console.log('Geolocation permissions granted');  
  pLat = position.coords.latitude;  
  pLong = position.coords.longitude; 
  });  
    
  $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" + pLat + "&lon=" + pLong +"&appid=50e74a4574951799ffff558b02debfe9", function(data) {
  console.log(pLat);
  console.log(pLong);
 $(".cityname").html("<h2>" + data.name + "</h2>");
 $(".weather").html("<spam>" + data.weather[0].description + "</spam>"); 
     
   });     
 
 };
                   
  myWeather();
  
  $("#getWeather").on("click", function() {
       myWeather();
   });
 
 });


    
      
    
 `indent preformatted text by 4 spaces``indent preformatted text by 4 spaces`

#2

Do you have a CodePen project you could link to instead?


#3

It is working on iexplorer but not on chrome. It blocking the location permission in chrome browser without asking permission whereas location is full granted in chrome privacy setting.


#4

its working see my comment below.


#5

Chrome blocks geolocation when you’re connected to a site via HTTP. You’ll need to make sure you’re connected to CodePen via HTTPS for geolocation to work. When you do that, you’ll notice that your AJAX call doesn’t go through. That needs to be HTTPS as well, so you’ll either have to find a new API or use the crossorigin.me proxy.

$.getJSON("https://crossorigin.me/http://api.openweathermap.org/data/2.5/weather?lat=" + pLat + "&lon=" + pLong +"&appid=50e74a4574951799ffff558b02debfe9", function(data) { /* ... */ )


#6

It still not working if codepen.io project opens in chrome browser. I change the code a bit.See the project link
http://codepen.io/riteshprk/pen/wzPEmE


#7
https://codepen.io/riteshprk/pen/wzPEmE <-- connect via HTTPS

#8

Thanks!! for pointing at “https” @PortableStick It works like a charm.