I want to grab the data from a function and pass it into a fetch URL, to get city data

Viewed 59

This is the code that I am working on below. I am trying to grab the latitude and longitude data from the 1st url, so that I can pass that into a new fetch request that takes lat and lon to grab weather data on a city with a 5 day forecast. But I am unsure how to call the data from one function and pass it as a string in the URL.

let weather = {
    "apiKey": "",
    "city": " ",

    fetchWeather: function(city) {
        // this fetch will call the api to grab the Lon and lat, using the function displayLatlon
        fetch("https://api.openweathermap.org/data/2.5/weather?q=" + city 
        + "&units=imperial&appid=" 
        + this.apiKey)

        .then(response => response.json())
        .then(data => this.displaylatlon(data))
        // This fetch will use the API to grab the weather conditions for the city based on it's lat and lon
        fetch("https://api.openweathermap.org/data/3.0/onecall?lat=" + **lat**
        + "&lon=" + **lon** 
        + "&exclude=hourly,daily&appid=" 
        + this.apiKey)

        .then(response => response.json())
        .then(weatherData =>console.log(weatherData))

    },
    // Function to grab the latitude and longitude of the city
     **displaylatlon: function(data) {
        const {lat, lon} = data.coord
        const{temp} = data.main**
        
        console.log(lat, lon)
     }
}
1 Answers

Roughly:

fetch("https://api.openweathermap.org/data/2.5/weather?q=" + city 
        + "&units=imperial&appid=" 
        + this.apiKey)
.then(response => response.json())
.then(data => {
   const {lat, lon} = data.coord;
   return fetch("https://api.openweathermap.org/data/3.0/onecall?lat=" + **lat**
        + "&lon=" + **lon** 
        + "&exclude=hourly,daily&appid=" 
        + this.apiKey)
})
.then(response => response.json())
.then(weatherData =>console.log(weatherData))

You can open a {} scope to use multiple lines of code.

Related