A problem with jQ/syntax in weather app

1

I’m building a weather app and so far so good :wink: But I ran into a trouble with getting a https to work properly: I tried to html its content and geolocation data to an id and nothing happens. I’m convinced that problem lies in my syntax because when I remove lat and long (which are vars for current geolocation) and instead place numerical values of my location, it works. Thanks for help!

$(document).ready(function(){
  // vars to store the data
  
  var far;
  var cel;
  var inKelvin;
  var long;
  var lat;
  
  //https for JSON + current geolocation
  
    var apId = "https://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&appid=5a58a57e6e275b561f89145e340eae23";
  
  // grabbing geolocation

 if (navigator.geolocation){
  navigator.geolocation.getCurrentPosition(function(position){
    
    //declaration of var values

    long = position.coords.longitude;
   lat = position.coords.latitude; 
    });
  } 

  $.getJSON(apId, function(data){
       $("#app").html(apId);
    
    // data for all of the math

    inKelvin = data.main.temp;
   var weat= data.weather[0].description;
    var wind = data.wind.speed;
    far = (inKelvin) * (9/5) - 459.67;
    cel = (inKelvin) - 273.15;
 
  });
});
2

The Geolocation API requires you to serve your webpage from a secure connection.

If you are opening your webpage as a local file, i.e., it shows file:/// in your address bar then your app is not going to work.

To fix this try using CodePen or a local web server that supports HTTPS like Caddy.

4

Thanks a lot! That did the trick :wink:

@abhineet97, I were coding on CodePen :wink: I just pasted code instead of a link to my pen.